Performance Optimization of JD LBS Store Detail Mini‑Program: Startup, Interaction, Energy, and Tracking Improvements

The JD LBS store‑detail mini‑program team tackled slow page loads, poor scrolling, cart lag, inaccurate tracking and high energy consumption through a series of frontend optimizations—including asynchronous info loading, on‑demand code injection, package slimming, gesture handling, and energy‑saving measures—resulting in roughly 50% faster startup, a 90 health score, 10% crash reduction and tracking reliability above 95%.

JD Retail Technology
JD Retail Technology
JD Retail Technology
Performance Optimization of JD LBS Store Detail Mini‑Program: Startup, Interaction, Energy, and Tracking Improvements

Introduction: To achieve near‑native experience and support rapid business iteration, JD LBS store‑detail (门详) team optimized startup, interaction, energy consumption and data tracking across the mini‑program.

Challenges: Slow page load (≈1.2 s on high‑end phones), poor list scrolling performance, cart expansion lag, inaccurate tracking, and high memory usage.

Results Overview: After four optimization phases, load speed improved ~50%, mini‑program health score ~90, crash rate reduced ~10%, and tracking availability >95%.

Startup Optimizations: Asynchronous pre‑fetch of the info interface reduced request time by ~158 ms; on‑demand code loading cut injected code from >6 MB to 2.7 MB, decreasing startup time from ~1200 ms to ~800 ms on Xiaomi 11; package size reduced from 1.2 MB to 0.49 MB.

Interaction Improvements: Implemented scroll‑view nesting with dynamic catchMove handling, optimized gesture support, flattened category tree, replaced heavy IntersectionObserver lookups with direct document.getElementById, and introduced batch rendering and key‑based diff to eliminate sticky‑layer re‑paints.

Key code snippets used:

// This View component will bind catchtouchmove instead of bindtouchmove</code><code><View catchMove={catchMove}></View>
<view id="container" catchtouchmove="{{catchMove}}"><slot></slot></view>
<native-container catchMove={catchMove}>嵌套Taro组件</native-container>

Energy Optimizations: Identified and disabled unnecessary timers, animations and large‑size media; applied scroll debouncing and image compression, achieving ~20% energy reduction during scrolling.

Tracking Governance: Revised exposure and PV/CLICK event logic, standardized reporting, and raised tracking usable rate to >95%.

Future Work: Continue energy‑level research, virtual list support, deeper component nesting reduction, cross‑platform sync, shared component libraries, H5 conversion, video capabilities, and native gesture support.

Original Source

Signed-in readers can open the original source through BestHub's protected redirect.

Sign in to view source
Republication Notice

This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactadmin@besthub.devand we will review it promptly.

optimizationEnergymini-program
JD Retail Technology
Written by

JD Retail Technology

Official platform of JD Retail Technology, delivering insightful R&D news and a deep look into the lives and work of technologists.

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.