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%.
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
<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.
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.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.