BestHub
Sign in
Tagged articles
62 articles
Page 1 of 1
vivo Internet Technology
vivo Internet Technology
Dec 17, 2025 · Frontend Development

Turning 3D Avatars into Video: Puppeteer, H5 Frames & FFmpeg Workflow

This article explains how to overcome performance and integration challenges of 3D avatar rendering across multiple scenarios by exporting avatars as video or GIF resources using a Puppeteer‑driven H5 frame capture pipeline combined with FFmpeg video synthesis, detailing the evaluation of alternatives and the final implementation steps.

H5PuppeteerWeb Automation
0 likes · 13 min read
Turning 3D Avatars into Video: Puppeteer, H5 Frames & FFmpeg Workflow
Yang Money Pot Technology Team
Yang Money Pot Technology Team
Aug 25, 2025 · Frontend Development

How to Boost H5 Page Load Speed: From Resource Preloading to NSR‑Lite

To dramatically improve H5 page load performance, this guide outlines a comprehensive strategy—including infrastructure setup, resource and HTML preloading, API prefetching with schema design, lightweight NSR‑Lite rendering, DNS pre‑resolution, and degradation safeguards—resulting in a rise in instant‑open rate from 10% to over 55%.

API PrefetchH5NSR-Lite
0 likes · 20 min read
How to Boost H5 Page Load Speed: From Resource Preloading to NSR‑Lite
JD Cloud Developers
JD Cloud Developers
Apr 23, 2025 · Frontend Development

Cut Development Time 40% by Reusing H5 Pages with a Monorepo

This article explains how reusing H5 marketing activity pages with a monorepo workspace can accelerate development by up to 40%, outlines five technical solutions, shows workspace structure and package configuration, and discusses central repository management and its suitability for similar projects.

DevelopmentH5Monorepo
0 likes · 3 min read
Cut Development Time 40% by Reusing H5 Pages with a Monorepo
DaTaobao Tech
DaTaobao Tech
Nov 4, 2024 · Frontend Development

Embedding Live Streaming Rooms into H5 Pages with Same‑Layer Rendering

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.

Front-endH5Mobile Development
0 likes · 10 min read
Embedding Live Streaming Rooms into H5 Pages with Same‑Layer Rendering
JD Retail Technology
JD Retail Technology
May 6, 2024 · Frontend Development

Common Testing Techniques and Implementation Strategies for JD H5 Marketing Pages

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.

H5JD HybridPerformance Optimization
0 likes · 16 min read
Common Testing Techniques and Implementation Strategies for JD H5 Marketing Pages
HelloTech
HelloTech
Mar 7, 2024 · Frontend Development

Implementation of Driver Authentication Video Capture Using WebRTC and RecordRTC

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.

Front-endH5JavaScript
0 likes · 10 min read
Implementation of Driver Authentication Video Capture Using WebRTC and RecordRTC
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Feb 7, 2024 · Frontend Development

How to Boost H5 Game Performance with Offline Packages and Smart Asset Management

This article details a comprehensive approach to improving the performance and user experience of complex H5 game-like applications by using offline package splitting, native splash screens, global state management with zustand, data prefetching, image loading optimizations, transition animations, and ranking list enhancements.

H5OfflineReact
0 likes · 18 min read
How to Boost H5 Game Performance with Offline Packages and Smart Asset Management
iQIYI Technical Product Team
iQIYI Technical Product Team
Nov 24, 2023 · Frontend Development

Performance and Experience Optimization of H5 Special Topic Pages in Mobile App WebView

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.

H5MobilePerformance Optimization
0 likes · 10 min read
Performance and Experience Optimization of H5 Special Topic Pages in Mobile App WebView
JD Tech
JD Tech
Sep 27, 2023 · Frontend Development

Core Front-End Technologies of JD Competition Ranking H5 Page

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.

CSSH5Vue
0 likes · 22 min read
Core Front-End Technologies of JD Competition Ranking H5 Page
vivo Internet Technology
vivo Internet Technology
Aug 9, 2023 · Frontend Development

Accessibility Adaptation Practices for Vivo H5 Front‑End Projects

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.

ARIAH5Mobile
0 likes · 18 min read
Accessibility Adaptation Practices for Vivo H5 Front‑End Projects
JD Cloud Developers
JD Cloud Developers
Jun 27, 2023 · Frontend Development

Unlocking JD’s Race Ranking H5: Key Front‑End Techniques & Animations

This article explores the core front‑end technologies behind JD’s Race Ranking H5 page, covering animation implementations, style configuration, skin switching, poster generation, debugging tools, API protection, and deployment workflows, offering practical insights and code examples for developers building sophisticated mobile web applications.

H5Vueanimation
0 likes · 21 min read
Unlocking JD’s Race Ranking H5: Key Front‑End Techniques & Animations
HomeTech
HomeTech
May 10, 2023 · Frontend Development

Comprehensive Guide to H5 Page Load Performance Optimization

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.

H5Viteoptimization
0 likes · 15 min read
Comprehensive Guide to H5 Page Load Performance Optimization
ITPUB
ITPUB
Jun 23, 2022 · Mobile Development

Flutter vs React Native vs Weex vs H5: Architecture, Performance, and Optimization

This article examines the four popular cross‑platform technologies—Flutter, React Native, Weex, and H5—by detailing their architectural layers, compilation models, rendering pipelines, typical performance bottlenecks, and practical optimization techniques, and offers guidance on selecting the most suitable stack for a given project.

FlutterH5Mobile Development
0 likes · 16 min read
Flutter vs React Native vs Weex vs H5: Architecture, Performance, and Optimization
Aotu Lab
Aotu Lab
Feb 24, 2022 · Frontend Development

How to Build a Multi‑Platform Page with Taro 3 for H5 and Mini‑Programs

This guide explains why Taro 3 was chosen for unified development, outlines its architecture evolution, and provides step‑by‑step instructions—including CLI setup, script configuration, plugin usage, routing, versioning, API requests, and mixed‑mode packaging—to create a single codebase that runs on both H5 and various mini‑program platforms.

Blended BuildH5Mini‑Program
0 likes · 15 min read
How to Build a Multi‑Platform Page with Taro 3 for H5 and Mini‑Programs
Shopee Tech Team
Shopee Tech Team
Dec 30, 2021 · Game Development

Inside Shopee Candy: Building a Scalable Match‑3 H5 Game Architecture

This article walks through the origin, architecture, and tooling of Shopee Candy, a multi‑region match‑3 H5 game, detailing the Algorithm SDK, animation system, map editor, score runner, replayer, and future plans for configurability, performance, anti‑cheat, and AI‑driven level design.

Game DevelopmentH5Tooling
0 likes · 16 min read
Inside Shopee Candy: Building a Scalable Match‑3 H5 Game Architecture
Xianyu Technology
Xianyu Technology
Sep 16, 2021 · Frontend Development

H5 Multi-Container Nested Scrolling with Sticky Tabs

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.

H5Nested ScrollingSticky Tabs
0 likes · 9 min read
H5 Multi-Container Nested Scrolling with Sticky Tabs
JD Retail Technology
JD Retail Technology
Sep 6, 2021 · Frontend Development

Flexible Template Solution for Tongtian Tower: Architecture and Implementation across CMS, H5, and Native Clients

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.

CMSFrontend ArchitectureH5
0 likes · 13 min read
Flexible Template Solution for Tongtian Tower: Architecture and Implementation across CMS, H5, and Native Clients
php Courses
php Courses
Aug 31, 2021 · Mobile Development

React Native and H5 Interaction: Communication Methods and Code Examples

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.

AndroidH5JavaScript
0 likes · 5 min read
React Native and H5 Interaction: Communication Methods and Code Examples
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Aug 9, 2021 · Frontend Development

How We Cut H5 Page Load Time by 50%: A Deep Dive into Performance Optimization

This article details the systematic performance optimization of Penguin Tutor's H5 core pages, covering metric collection, analysis methods, environment setup, and concrete practices such as network tuning, code splitting, lazy loading, resource hints, and server‑side improvements that reduced total bundle size by 50% and cut onload time from over 6 seconds to around 1.2 seconds.

H5Webfrontend
0 likes · 22 min read
How We Cut H5 Page Load Time by 50%: A Deep Dive into Performance Optimization
TAL Education Technology
TAL Education Technology
Jul 8, 2021 · Frontend Development

Resolving WeChat H5 Authorization Loops, Poster Generation, and Page Performance Tracking

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.

AuthorizationCanvasH5
0 likes · 12 min read
Resolving WeChat H5 Authorization Loops, Poster Generation, and Page Performance Tracking
Liulishuo Tech Team
Liulishuo Tech Team
Apr 22, 2021 · Frontend Development

Building a Cross‑Platform English Quiz Mini‑Game with React & Pixi.js

This article details how to create a cross‑platform English‑learning quiz PK mini‑game for both a main app (H5) and WeChat mini‑games, covering technology selection, project structure, webpack configuration, virtual routing, component development with react‑pixi‑fiber, animation techniques, platform adapters, and performance optimizations.

H5ReactWeChat Mini Game
0 likes · 22 min read
Building a Cross‑Platform English Quiz Mini‑Game with React & Pixi.js
Baidu Geek Talk
Baidu Geek Talk
Mar 15, 2021 · Frontend Development

Progressive Front-End Rendering: Route Separation, Pre‑Static Generation, and WebView Pre‑Creation for H5 Performance Optimization

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.

H5frontendoptimization
0 likes · 12 min read
Progressive Front-End Rendering: Route Separation, Pre‑Static Generation, and WebView Pre‑Creation for H5 Performance Optimization
JD Retail Technology
JD Retail Technology
Dec 3, 2020 · Mobile Development

Technical Overview of JD.com Mobile Checkout: Hybrid H5 and Native Integration

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.

H5Hybrid AppMobile Development
0 likes · 7 min read
Technical Overview of JD.com Mobile Checkout: Hybrid H5 and Native Integration
Laravel Tech Community
Laravel Tech Community
Sep 2, 2020 · Frontend Development

Obtaining a WeChat User's Nickname in an H5 Page via OAuth Authorization

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.

APIH5JavaScript
0 likes · 7 min read
Obtaining a WeChat User's Nickname in an H5 Page via OAuth Authorization
Taobao Frontend Technology
Taobao Frontend Technology
Jul 2, 2020 · Frontend Development

How Same‑Layer Rendering Powers Alibaba’s H5 Video Player for 618 Live Events

This article explains how Alibaba’s multimedia front‑end team built a same‑layer rendering video player for H5, detailing the architecture, performance advantages, degradation strategies, issues encountered during the 618 promotion, and future plans to improve playback experience across live and on‑demand scenarios.

AlibabaH5Multimedia
0 likes · 11 min read
How Same‑Layer Rendering Powers Alibaba’s H5 Video Player for 618 Live Events
Taobao Frontend Technology
Taobao Frontend Technology
Jun 18, 2020 · Mobile Development

How to Seamlessly Deep Link Users from H5 to the Taobao App

This article explains the principles and practical implementations of deep linking (URL Scheme, Intent, and Universal Links) for guiding users from web pages or other apps to the Taobao mobile app, covering registration, compatibility, success detection, and restoration strategies.

App integrationH5Mobile Development
0 likes · 14 min read
How to Seamlessly Deep Link Users from H5 to the Taobao App
WecTeam
WecTeam
Apr 8, 2020 · Frontend Development

How MPM Revolutionizes H5 Page Data Modeling for Efficient Multi‑Platform Rendering

This article details how JD's MPM visual H5 page builder tackles complex data‑request challenges by introducing a unified data model, request aggregation, and three‑end rendering support, offering a scalable solution that improves performance, maintainability, and developer experience across web, app, and server‑side rendering.

H5MPMdata modeling
0 likes · 23 min read
How MPM Revolutionizes H5 Page Data Modeling for Efficient Multi‑Platform Rendering
Huajiao Technology
Huajiao Technology
Dec 24, 2019 · Frontend Development

How Huajiao Enables Server‑Driven Dynamic Voice‑Chat Layouts with Zero Client Code

The article explains Huajiao's server‑and‑H5 driven dynamic layout architecture for multi‑user voice rooms, detailing its design principles, benefits, three core concepts, synchronization mechanisms, interaction flow, and how it drastically reduces client development effort while supporting flexible, real‑time UI changes.

H5Real-Timedynamic layout
0 likes · 9 min read
How Huajiao Enables Server‑Driven Dynamic Voice‑Chat Layouts with Zero Client Code
FangDuoduo UEDC
FangDuoduo UEDC
Sep 30, 2019 · Mobile Development

Native Apps vs H5: Benefits, Drawbacks, and Design Pitfalls

This article compares native applications and H5 web apps, outlining their respective advantages, disadvantages, usage scenarios, and common design limitations such as keyboard handling, close‑button issues, overlay coverage, and native bar extensibility.

H5Mobile DevelopmentWeb Apps
0 likes · 8 min read
Native Apps vs H5: Benefits, Drawbacks, and Design Pitfalls
Qunar Tech Salon
Qunar Tech Salon
Sep 3, 2019 · Frontend Development

Nanachi Multi‑End Mini‑Program Translation Framework: Architecture, Advantages, and Technical Details

Nanachi is Qunar's multi‑end mini‑program translation framework that lets developers write React‑based code once and run it on various mini‑program platforms and H5, offering streamlined installation, unified APIs, component libraries, scoped styling, and comprehensive runtime and build‑time solutions to boost development efficiency.

FrameworkH5Mini Program
0 likes · 8 min read
Nanachi Multi‑End Mini‑Program Translation Framework: Architecture, Advantages, and Technical Details
360 Tech Engineering
360 Tech Engineering
May 27, 2019 · Mobile Development

Common Patterns for H5 and Native App Interaction

This article explains common H5‑to‑native app interaction patterns, detailing basic interfaces, one‑way and two‑way calls, implementation approaches, and the considerations for whether the H5 or the native side leads the integration, with code examples for Android and iOS.

AndroidH5JavaScript Bridge
0 likes · 10 min read
Common Patterns for H5 and Native App Interaction
58UXD
58UXD
Mar 27, 2019 · Product Management

Designing a Singles' Day Interactive Game to Drive 58 Rental App Engagement

This case study details how a fast‑track H5 puzzle game was conceptualized, styled with outline illustrations, and executed in just eight days to celebrate Singles' Day, boost user interaction, and channel traffic to the 58 rental mini‑program, while sharing design standards, collaboration methods, and user feedback.

H5Singles' Daygame design
0 likes · 8 min read
Designing a Singles' Day Interactive Game to Drive 58 Rental App Engagement
360 Tech Engineering
360 Tech Engineering
Mar 8, 2019 · Frontend Development

Common Patterns for H5 and Native App Interaction via WebView Bridge

This article explains the typical interaction models between H5 (HTML5) pages embedded in mobile apps and native code, covering basic bridge interfaces, single‑direction and bi‑directional calls, implementation styles, and the trade‑offs of H5‑driven versus native‑driven architectures, with concrete code examples.

H5JavaScript Bridge
0 likes · 11 min read
Common Patterns for H5 and Native App Interaction via WebView Bridge
Youzan Coder
Youzan Coder
Aug 24, 2018 · Frontend Development

H5 Front-End Performance Testing: Loading Process, White‑Screen and Lag Analysis

The article explains H5 front‑end performance bottlenecks—white‑screen delays and interaction lag—by detailing the page loading stages, showing how to measure first‑paint and load times with Chrome DevTools and device debugging, and recommending solutions such as server‑side rendering, touch‑area optimization, script debugging and memory‑leak prevention to improve first‑screen speed and overall smoothness.

First PaintH5Mobile Web
0 likes · 9 min read
H5 Front-End Performance Testing: Loading Process, White‑Screen and Lag Analysis
JD Tech
JD Tech
Mar 26, 2018 · Frontend Development

JSSDK: A Frontend Development Toolkit for JD App Integration

JSSDK is a JavaScript SDK that enables H5 developers to quickly integrate JD app features such as sharing, deep linking, and native function calls across platforms, offering modular, version‑compatible, and type‑safe APIs to streamline mobile web development.

App integrationH5JSSDK
0 likes · 7 min read
JSSDK: A Frontend Development Toolkit for JD App Integration
Aotu Lab
Aotu Lab
Jan 9, 2018 · Game Development

How to Build a Water‑Pressure Ring H5 Game with CreateJS and Matter.js

This article walks through the design and implementation of a water‑pressure ring H5 game, covering technology selection, code architecture, integration of CreateJS with Matter.js physics, handling of ring rendering, needle collision detection, skill effects, performance optimizations, and practical tips for overcoming common challenges in 2D‑to‑3D simulation.

CreateJSH5Matter.js
0 likes · 18 min read
How to Build a Water‑Pressure Ring H5 Game with CreateJS and Matter.js
Hujiang Technology
Hujiang Technology
Jun 13, 2017 · Frontend Development

Designing Data Structures for a Visual H5 Page Editor (Web IDE)

The article explains how to design a data‑driven architecture for a visual H5 page editor, detailing the abstraction of pages, elements, and history into structured objects, and showing how front‑end developers can map complex UI interactions to clean, editable data models.

Data StructureH5Visual Editor
0 likes · 14 min read
Designing Data Structures for a Visual H5 Page Editor (Web IDE)
Architecture Digest
Architecture Digest
Oct 30, 2016 · Frontend Development

Challenges and Solutions in H5 Live Streaming Development

The article outlines the end‑to‑end workflow of H5 live streaming, discusses state control, WebSocket‑based comment handling, heartbeat reconnection, video compatibility issues, and practical code techniques for detecting and recovering from stream stalls.

H5Real-TimeWebSocket
0 likes · 9 min read
Challenges and Solutions in H5 Live Streaming Development
Tencent TDS Service
Tencent TDS Service
Aug 11, 2016 · Frontend Development

Unlocking H5 Video Live Streaming: From Capture to Playback

This article walks through mobile video live streaming fundamentals, covering H5 playback, WebRTC recording, HLS streaming, RTMP server setup, iOS capture, user interaction features, and practical code examples to help front‑end engineers build robust live video solutions.

H5RTMPWebRTC
0 likes · 16 min read
Unlocking H5 Video Live Streaming: From Capture to Playback
Architect
Architect
Jan 14, 2016 · Mobile Development

Technology Selection and Architecture Choices for Mobile Apps: Native vs H5, Swift vs Objective‑C, and MVC/MVP/MVVM

The article discusses practical technology selection for mobile app development, weighing native versus H5 approaches, choosing between Objective‑C and Swift, and comparing MVC, MVP, and MVVM architectures, emphasizing decisions based on team resources, project timelines, and long‑term maintainability.

Architecture PatternsH5Swift
0 likes · 8 min read
Technology Selection and Architecture Choices for Mobile Apps: Native vs H5, Swift vs Objective‑C, and MVC/MVP/MVVM
Architect
Architect
Sep 23, 2015 · Frontend Development

H5 Performance Optimization: Principles, Strategies, and Testing

This article explains why H5 performance matters, defines the one‑second rule for different network conditions, and provides comprehensive front‑end optimization techniques—including resource loading, image handling, server deployment, code standards, testing tools, and classic case studies—to improve user experience on mobile web applications.

H5MobileWeb
0 likes · 22 min read
H5 Performance Optimization: Principles, Strategies, and Testing