BestHub
Sign in
Tagged articles
14 articles
Page 1 of 1
SF Technology Team
SF Technology Team
Aug 30, 2025 · Frontend Development

Why Frontend Performance Testing Is Critical for Product Success

This article explains how integrating real‑user‑focused frontend performance testing into development, testing, and release pipelines—using metrics like FCP, LCP, INP, CLS, and TTFB, along with tools such as Lighthouse, RUM, and automated page traversal—ensures products meet user expectations, drive business goals, and stay competitive.

LighthousePerformance TestingReal User Monitoring
0 likes · 9 min read
Why Frontend Performance Testing Is Critical for Product Success
SF Technology Team
SF Technology Team
May 26, 2025 · Frontend Development

How We Cut LCP by 73% for a Billion‑User Membership Site

Facing the challenges of a billion‑user membership platform, we analyzed front‑end performance metrics, applied resource slimming, lazy loading, network optimizations, and SSR/pre‑rendering techniques, achieving up to 73% LCP reduction and dramatically improving page load speed and user retention.

Resource OptimizationSSRfrontend performance
0 likes · 15 min read
How We Cut LCP by 73% for a Billion‑User Membership Site
Airbnb Technology Team
Airbnb Technology Team
Jul 16, 2024 · Frontend Development

Airbnb Web Performance Metrics and Their Measurement

Airbnb tracks five real‑user performance metrics—Time To First Contentful Paint, Time To First Meaningful Paint, First Input Delay, Total Blocking Time, and Cumulative Layout Shift—using a mix of browser APIs and custom polyfills, combines them into a weighted Page Performance Score, and leverages that score to guide trade‑off decisions and detect regressions.

AirbnbMetricsWeb Performance
0 likes · 11 min read
Airbnb Web Performance Metrics and Their Measurement
JD Retail Technology
JD Retail Technology
Nov 30, 2023 · Frontend Development

Front‑End Performance Optimization: Understanding Browser Rendering, Web Vitals, and Practical Solutions

This article examines front‑end performance issues such as page freeze caused by heavy JavaScript computation, explains browser rendering threads, processes, and key Web Vitals (LCP, FID, CLS), and provides practical optimization techniques including code splitting, Web Workers, CDN usage, and build‑time configurations.

Web Workeroptimizationweb-vitals
0 likes · 26 min read
Front‑End Performance Optimization: Understanding Browser Rendering, Web Vitals, and Practical Solutions
ZhongAn Tech Team
ZhongAn Tech Team
Nov 17, 2023 · Frontend Development

Understanding Interaction to Next Paint (INP) Metric and How to Measure It

This article explains the INP (Interaction to Next Paint) performance metric, its calculation method, satisfaction thresholds, differences from FID, and provides practical guidance on measuring INP using Chrome's CrUX, PageSpeed Insights, the web‑vitals library, Chrome extensions, and custom console scripts.

ChromeINPMetrics
0 likes · 11 min read
Understanding Interaction to Next Paint (INP) Metric and How to Measure It
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 9, 2023 · Frontend Development

Using Resource Hints (Prefetch, Preload, Preconnect, DNS‑Prefetch) to Optimize Frontend Loading Performance

This article explains how to use the four resource‑hint APIs—prefetch, preload, preconnect, and DNS‑prefetch—along with the crossorigin attribute and a custom npm tool (resource‑hint‑generator) to dramatically reduce page load times, improve web‑vitals, and increase cache‑hit rates, providing code examples, tables, and validation steps.

Preconnectfrontend performancenpm
0 likes · 17 min read
Using Resource Hints (Prefetch, Preload, Preconnect, DNS‑Prefetch) to Optimize Frontend Loading Performance
Bilibili Tech
Bilibili Tech
Jul 18, 2023 · Frontend Development

Frontend Performance Monitoring: Loading Metrics and Jank Detection using PerformanceObserver and js-self-profiling API

The article explains how to build a frontend performance monitoring system that uses PerformanceObserver and the js‑self‑profiling API to capture Core Web Vitals, detect long‑task jank, correlate network requests and user actions, and preview future ComputePressure metrics for comprehensive user‑experience diagnostics.

ComputePressurePerformance Monitoringfrontend
0 likes · 11 min read
Frontend Performance Monitoring: Loading Metrics and Jank Detection using PerformanceObserver and js-self-profiling API
SQB Blog
SQB Blog
Sep 15, 2022 · Frontend Development

Mastering Front-End Performance: How to Use PerformanceObserver & Metrics

This article explains how to monitor and analyze front‑end performance using the deprecated performance.timing API and the modern PerformanceObserver, detailing key web‑vital metrics such as TTFB, FCP, LCP, FID, and CLS, with code examples and practical interpretation guidelines.

Metricsfrontendperformanceobserver
0 likes · 13 min read
Mastering Front-End Performance: How to Use PerformanceObserver & Metrics
Ctrip Technology
Ctrip Technology
Feb 24, 2022 · Frontend Development

Performance Monitoring and Optimization of SSR Applications in Ctrip Financial Frontend

This article describes how Ctrip Financial’s front‑end team measured, analyzed, and optimized key web‑performance metrics such as First Contentful Paint, DNS/TCP durations, and Cumulative Layout Shift for their server‑side rendered applications, providing concrete monitoring code, data‑processing methods, and practical optimization techniques to improve user experience and achieve a 70%+ instant‑load rate.

JavaScriptSSRfrontend
0 likes · 10 min read
Performance Monitoring and Optimization of SSR Applications in Ctrip Financial Frontend
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Feb 14, 2022 · Frontend Development

Front‑End Performance Optimization: RAIL Model, Core Web Vitals, and Practical Best Practices

This article consolidates front‑end performance knowledge by explaining the RAIL model, detailing user‑centric metrics such as FP, FCP, LCP, FID, TTI, TBT and CLS, describing how to capture them with tools like Lighthouse and web‑vitals, and offering concrete optimization techniques ranging from caching and HTTP/2 to code‑splitting, tree‑shaking, skeleton screens and server‑side rendering.

RAILfrontendoptimization
0 likes · 24 min read
Front‑End Performance Optimization: RAIL Model, Core Web Vitals, and Practical Best Practices
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 12, 2021 · Frontend Development

Frontend Monitoring Platform: Data Collection and Reporting Techniques

This article explains the data collection and reporting component of a complete frontend monitoring platform, detailing performance metrics such as FP, FCP, LCP, CLS, and providing practical JavaScript code examples for measuring, observing, and reporting these metrics, along with error and behavior monitoring techniques.

error trackingfrontendmonitoring
0 likes · 28 min read
Frontend Monitoring Platform: Data Collection and Reporting Techniques
Tencent Cloud Developer
Tencent Cloud Developer
Sep 10, 2021 · Frontend Development

Front-End Performance Monitoring (RUM) and Optimization Strategies

The article introduces Tencent Cloud’s Real‑User‑Monitoring platform, explains key performance timing points and metric calculations, links RUM data to Google Web Vitals, and demonstrates a data‑driven optimization case that cut first‑screen load from 4.8 s to 3.2 s, halved resource load time, and dramatically improved CLS.

Performance MonitoringRUMfrontend
0 likes · 16 min read
Front-End Performance Monitoring (RUM) and Optimization Strategies
Tencent Cloud Developer
Tencent Cloud Developer
Jun 1, 2021 · Frontend Development

Front‑End Performance Monitoring: Metrics, Types, and Data Collection

Front‑end performance monitoring lets developers detect issues early, compare synthetic and real‑user approaches, track key metrics like LCP, FID, and CLS, and gather data via the web‑vitals library, Performance API, and error‑tracking hooks to systematically improve load speed, interactivity, and visual stability.

LighthousePerformance APIPerformance Monitoring
0 likes · 16 min read
Front‑End Performance Monitoring: Metrics, Types, and Data Collection