0 views collected around this technical thread.
This article describes how reusable H5 marketing activity pages can be quickly built using five technical solutions, introduces a centralized workspace and monorepo structure with example configurations, and explains the benefits and considerations of central repository management for front‑end development.
By unifying the live‑room player with a same‑layer rendering component, exposing real‑time data through a communication layer, and using a pool‑based multi‑instance architecture that adapts to tablets and foldable screens, developers can embed native‑like immersive live rooms directly into H5 pages, simplifying integration and enabling future AI‑driven features.
This article outlines the architecture of JD's H5 marketing pages, compares native and H5 development, details container layering, describes functional implementation, and presents a comprehensive set of server‑side and front‑end testing methods, performance optimization, online tracking, and current pain points to improve testability and reliability.
The project implements a cross‑platform driver authentication video capture module by using WebRTC to access rear‑facing cameras, RecordRTC to record a five‑second clip with custom constraints, and uploading the resulting Blob to Alibaba Cloud OSS for OCR, ensuring consistent functionality across native apps, mini‑programs, and external H5 pages.
This tutorial explains how to add a QR‑code scanning feature to an H5 page with Vue2 by installing html5-qrcode, handling HTTPS requirements, and providing complete HTML, JavaScript, and CSS code snippets for a functional camera‑based scanner.
By implementing offline caching of libraries, template pre‑rendering, native player embedding, split‑screen loading, API slimming, WebP image delivery, and UI tweaks such as title‑bar customization, hide‑nav flags, pull‑to‑refresh, early background color and placeholder optimization, the H5 special‑topic pages in the mobile app WebView achieve up to 60 % faster first‑screen loads, dramatically lower network usage, and a smoother, more immersive user experience.
PageSpy is an open‑source frontend remote‑debugging platform that wraps native browser APIs, captures runtime parameters, and provides a console‑like UI for developers to view client information, console output, network requests, and execute JavaScript remotely, dramatically reducing cross‑region debugging effort.
This article examines the core front‑end technologies employed in JD’s Competition Ranking H5 page, covering animation implementations, style configuration, skin switching, poster generation, debugging tools, request handling, and deployment scripts, providing practical insights and code examples for front‑end developers.
Vivo’s front‑end team outlines practical accessibility adaptations for H5 Android projects, emphasizing ARIA roles and states, proper tabindex ordering, language attributes, alt text or aria‑label for images, button roles, numeric speech conversion, focus management in dialogs and pickers, and a comprehensive checklist to ensure inclusive mobile experiences.
This article details JD's end‑to‑end H5 observability solution, covering the challenges of hybrid app development, the design of a three‑stage UEM platform, deep active and passive monitoring, automated quality gates, and real‑world case studies that demonstrate cost savings and performance improvements.
This article details comprehensive strategies for accelerating H5 page load times, covering background analysis, performance metrics, loading strategies, preload/prefetch, DNS prefetch, preconnect, skeleton screens, image compression with WebP, CDN caching, bundle optimization with Vite/Webpack, and provides practical code examples and configuration snippets.
This article describes a visual self‑service event‑tracking platform for AutoHome H5 pages that separates tracking code from business code, provides a visual editor for non‑technical users, generates SDKs, and includes a Chrome extension for cross‑domain iframe injection.
This article explains the core H5 page performance metrics such as FCP, LCP, CLS, TTI, and TBT, describes how to measure them with Lighthouse, and provides comprehensive network‑ and rendering‑layer optimization techniques along with real‑world case studies from the PLUS team to improve user experience.
The article describes an H5 technique for multi‑tab nested scrolling using a single native scroll container where child tabs retain their own offsets, the tab bar sticks via position:sticky, and scroll inertia is propagated, while addressing iOS flicker, overflow handling, Android WebView bugs, lazy loading, and future GPU‑cache optimization.
The article introduces the flexible template solution for the Tongtian Tower marketing system, detailing its background, design principles, CMS architecture, flexible canvas implementation, H5 rendering strategy, native client SDK, technical choices, and the achieved efficiency gains across multiple business scenarios.
This article explains how to enable two-way communication between React Native and H5 pages using WebView, covering message handling in both directions, code examples for sending and receiving data, and important migration notes from the built‑in WebView to react‑native‑webview.
This article details the challenges encountered when developing WeChat H5 pages—such as authorization‑loop redirects, cross‑origin poster creation with html2canvas, iPhone 100vh scrolling bugs, and precise performance timing using window.performance—and presents practical code‑based solutions and compatibility tips for both iOS and Android devices.
The article describes a progressive front‑end rendering strategy that replaces synchronous template rendering with route separation, build‑time pre‑static HTML generation, and WebView pre‑creation, using skeleton components to cut first‑paint time, lower TTFB and JavaScript delays, and improve H5 performance, scalability and maintenance.
The article details JD.com's mobile checkout architecture, explaining its dual functions of payment selection and post‑payment confirmation, the seven supported payment methods, the hybrid H5‑WebView approach with native interaction, its advantages and drawbacks, and practical implementation guidelines for Android and iOS.
This tutorial explains how to configure a certified WeChat public account, construct the OAuth authorization URL, exchange the returned code for an access token, retrieve the user's basic profile—including nickname—and redirect back to the H5 page, while covering required parameters and token refresh details.