Tagged articles
8 articles
Page 1 of 1
DaTaobao Tech
DaTaobao Tech
Sep 18, 2024 · Frontend Development

From Code to Browser: Front‑End Development, Build, and Deployment

Front‑end development transforms a URL request into a rendered page by downloading HTML, CSS, and JavaScript, building the DOM and CSSOM, executing scripts, constructing a render tree, then performing layout and paint, while modern workflows use component frameworks, build tools for bundling and minification, versioned or hashed assets with long‑term CDN caching, and non‑overlapping gray‑release deployments to ensure smooth updates.

DeploymentWeb Developmentbuild tools
0 likes · 14 min read
From Code to Browser: Front‑End Development, Build, and Deployment
NetEase Yanxuan Technology Product Team
NetEase Yanxuan Technology Product Team
Jul 18, 2022 · Frontend Development

From Zero to Mastery: How to Systematically Optimize Front‑End Performance

This comprehensive guide walks you through the entire front‑end performance optimization lifecycle—from understanding why performance matters and setting measurable goals, to building metrics, implementing concrete strategies across caching, networking, rendering, and finally validating results with monitoring and retrospectives.

Performance MonitoringWeb Optimizationcritical rendering path
0 likes · 18 min read
From Zero to Mastery: How to Systematically Optimize Front‑End Performance
Alibaba Terminal Technology
Alibaba Terminal Technology
May 18, 2022 · Frontend Development

How Alibaba Cloud Security Achieved Sub‑Second Front‑End Performance with PWA and PCP

Alibaba Cloud Security’s front‑end team tackled the “1‑second battle” by redefining performance with the PCP metric and leveraging PWA techniques—service workers, skeleton screens, aggressive code‑splitting, and micro‑frontend architecture—to shrink perceived load times from seconds to sub‑400 ms across eight products.

PCP metricPWAService Worker
0 likes · 9 min read
How Alibaba Cloud Security Achieved Sub‑Second Front‑End Performance with PWA and PCP
Alibaba Terminal Technology
Alibaba Terminal Technology
Aug 16, 2021 · Frontend Development

Unlock Rendering Performance: From Hardware to Frontend Optimization

This article explores the essence of rendering performance optimization by examining hardware trade‑offs, rendering and computation perspectives, the critical rendering path, and practical strategies—including toolchains like Lighthouse and the Navigation Timing API—to systematically improve front‑end speed and efficiency.

BrowserRenderingcritical rendering path
0 likes · 27 min read
Unlock Rendering Performance: From Hardware to Frontend Optimization
360 Tech Engineering
360 Tech Engineering
Feb 13, 2019 · Frontend Development

How to Optimize the Critical Rendering Path

This article explains how to improve web page rendering speed by reducing the number of critical resources, shortening the critical path length, and minimizing critical bytes through DOM, CSSOM, and JavaScript optimizations, including practical code examples and performance measurements.

DOMFrontend OptimizationWeb Performance
0 likes · 12 min read
How to Optimize the Critical Rendering Path
Yuewen Frontend Team
Yuewen Frontend Team
Jul 27, 2018 · Frontend Development

How CSS Is Rendered: Unveiling the Critical Rendering Path

This article explains how browsers parse HTML, build the DOM and CSSOM, create the render tree, and perform layout and paint, highlighting why understanding CSS's role in the critical rendering path is essential for improving page load speed and user experience.

Browser RenderingCSScritical rendering path
0 likes · 12 min read
How CSS Is Rendered: Unveiling the Critical Rendering Path