Tagged articles
3130 articles
Page 19 of 32
政采云技术
政采云技术
Jul 20, 2021 · Frontend Development

Design and Implementation of a Custom Frontend Build and Deployment Platform (Yunzhang)

This article explains why a dedicated frontend build platform is needed, describes its core capabilities such as automated build, pluggable pipelines, audit‑based release, and external plugin exposure, and details the Docker‑in‑Docker architecture, process‑pool design, and sample Node.js code for a scalable CI/CD solution.

Build AutomationProcess Poolci/cd
0 likes · 20 min read
Design and Implementation of a Custom Frontend Build and Deployment Platform (Yunzhang)
New Oriental Technology
New Oriental Technology
Jul 19, 2021 · Frontend Development

Implementing a Simple Tween/Easing Library in TypeScript

This article introduces a lightweight TypeScript tween library, explains its core classes HTweenLite and HTween, details the implementation of various easing functions, and demonstrates how to use the library to perform data-driven animations without relying on any specific UI framework.

EasingLibraryTween
0 likes · 15 min read
Implementing a Simple Tween/Easing Library in TypeScript
Taobao Frontend Technology
Taobao Frontend Technology
Jul 16, 2021 · Frontend Development

What ECMAScript Proposals Will Shape JavaScript’s Future?

This article surveys the most interesting ECMAScript proposals—ranging from new data structures like Record & Tuple to syntax enhancements such as the pipeline operator—explaining their purpose, current stage, and practical examples, while also covering the TC39 process and related background for front‑end developers.

ECMAScriptJavaScriptJavaScript proposals
0 likes · 21 min read
What ECMAScript Proposals Will Shape JavaScript’s Future?
Airbnb Technology Team
Airbnb Technology Team
Jul 16, 2021 · Frontend Development

How Airbnb’s visx Turns React into a Powerful Visualization Engine

The article explains how Airbnb’s visx library, built on React and D3 primitives, addresses the need for a lightweight, highly expressive, and performant front‑end visualization solution by offering modular packages, TypeScript safety, and seamless integration with existing React codebases.

Data visualizationReactTypeScript
0 likes · 11 min read
How Airbnb’s visx Turns React into a Powerful Visualization Engine
Taobao Frontend Technology
Taobao Frontend Technology
Jul 15, 2021 · Frontend Development

Building a Powerful Docs Site for a Front‑End Graphics Engine Using Gatsby

This article walks through the challenges and solutions of creating an integrated, searchable, multilingual documentation website for the Oasis Engine graphics engine, covering the selection of static site generators, the use of Gatsby with TypeDoc and GraphQL, custom plugins for embedding demos, and implementing global search with Algolia DocSearch.

DocumentationGatsbyGraphQL
0 likes · 22 min read
Building a Powerful Docs Site for a Front‑End Graphics Engine Using Gatsby
Aotu Lab
Aotu Lab
Jul 15, 2021 · Frontend Development

How JD’s Frontend Team Delivered 16 High‑Traffic 618 Event Halls in Record Time

This article details how JD's front‑end team tackled the 2021 618 shopping festival by using Taro3 for cross‑platform H5 and mini‑program development, implementing disaster‑recovery services, intelligent UI personalization, pull‑to‑refresh, and efficient collaboration practices to launch sixteen high‑performance event halls quickly and reliably.

Collaborationcross‑platformdisaster recovery
0 likes · 14 min read
How JD’s Frontend Team Delivered 16 High‑Traffic 618 Event Halls in Record Time
ByteDance Terminal Technology
ByteDance Terminal Technology
Jul 8, 2021 · Frontend Development

Modern Web Development at ByteDance: From Traditional Front‑End Stack to the MWA/Jupiter Framework

This presentation details ByteDance's transition from a legacy front‑end development paradigm plagued by scaffolding and Webpack bottlenecks to a modern, serverless‑enabled architecture built around the MWA engineering standard and the Jupiter meta‑framework, highlighting the underlying problems, industry trends, and the resulting unified development experience.

FrameworkJupiterMWA
0 likes · 32 min read
Modern Web Development at ByteDance: From Traditional Front‑End Stack to the MWA/Jupiter Framework
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
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Jul 7, 2021 · Frontend Development

Mastering Webpack: From Zero to Advanced Configuration for Faster Development

This comprehensive tutorial walks you through setting up a minimal Webpack project, adding Babel, configuring dev‑server with hot reload, optimizing source maps, splitting environments, handling CSS/LESS, extracting and minifying assets, managing static resources, and applying advanced performance tricks such as caching, code splitting, and multi‑threaded loaders.

builddev-serverfrontend
0 likes · 24 min read
Mastering Webpack: From Zero to Advanced Configuration for Faster Development
JD Tech Talk
JD Tech Talk
Jul 7, 2021 · Frontend Development

Design and Architecture of JD's Lego Low‑Code Visual Building Platform

The article presents a comprehensive overview of JD's Lego low‑code visual building platform, detailing its business motivations, architectural design, core front‑end technologies, template creation workflow, debugging tools, unified build and release process, and future development directions.

Vuefrontendlow-code
0 likes · 16 min read
Design and Architecture of JD's Lego Low‑Code Visual Building Platform
Taobao Frontend Technology
Taobao Frontend Technology
Jul 6, 2021 · Frontend Development

What’s New in React 18? A Deep Dive into Concurrent Rendering and Suspense

React 18 introduces a progressive upgrade path with concurrent rendering, automatic batching, a new Root API, startTransition, and an improved Suspense SSR architecture, allowing developers to adopt new features with minimal code changes while enhancing performance and enabling selective hydration and streaming HTML.

Automatic BatchingReactReact 18
0 likes · 12 min read
What’s New in React 18? A Deep Dive into Concurrent Rendering and Suspense
ByteDance Web Infra
ByteDance Web Infra
Jul 4, 2021 · Frontend Development

Modern Web Development at ByteDance: From Traditional Front‑End Stack to the MWA/Jupiter Framework

This article reviews ByteDance's transition from a fragmented, legacy front‑end toolchain to a unified modern web development platform, describing the shortcomings of traditional scaffolding, the rise of meta‑frameworks, and the design and capabilities of the internal MWA and Jupiter frameworks that power the open‑source Modern.js project.

ByteDanceEngineeringFramework
0 likes · 32 min read
Modern Web Development at ByteDance: From Traditional Front‑End Stack to the MWA/Jupiter Framework
Top Architect
Top Architect
Jul 3, 2021 · Backend Development

Three Practical Methods for Implementing Single Sign-On (SSO) in B/S Systems

This article explains the principle of single sign‑on and compares three implementation techniques—parent‑domain cookies, a dedicated authentication centre, and cross‑domain LocalStorage—detailing their mechanisms, advantages, limitations, and providing sample code for the LocalStorage approach.

AuthenticationCookieSSO
0 likes · 11 min read
Three Practical Methods for Implementing Single Sign-On (SSO) in B/S Systems
Laravel Tech Community
Laravel Tech Community
Jul 1, 2021 · Frontend Development

How to Build a Visual Dashboard (Large Screen) Using FineReport

This article walks through the complete process of creating a high‑impact visual dashboard for large‑screen displays using FineReport, covering tool selection, data preparation, report creation, design, visual polishing, and adding dynamic effects.

DashboardData IntegrationFineReport
0 likes · 5 min read
How to Build a Visual Dashboard (Large Screen) Using FineReport
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Jun 30, 2021 · Frontend Development

Mastering Webpack Code Splitting: From Entry Points to Magic Comments

This article explains how to use Webpack's code splitting techniques—including multiple entry points, the SplitChunksPlugin, dynamic imports, and magic comments—to break large bundles into smaller chunks, reduce duplicate dependencies, and improve loading performance in modern frontend applications.

JavaScriptcode-splittingfrontend
0 likes · 13 min read
Mastering Webpack Code Splitting: From Entry Points to Magic Comments
ByteDance Terminal Technology
ByteDance Terminal Technology
Jun 30, 2021 · Frontend Development

Why Traditional Frontend Scaffolds Fail and How Cloud‑Based Engineering Solutions Solve It

The article traces the evolution of frontend scaffolding from manual copy‑paste templates to CLI tools, examines maintenance and version‑upgrade challenges, and introduces ByteDance’s cloud‑native “Engineering Scheme” with three initialization methods—template, cloud CLI, and webshell—offering automated, container‑based project creation and a marketplace for best‑practice solutions.

CLICloud Nativebest practices
0 likes · 9 min read
Why Traditional Frontend Scaffolds Fail and How Cloud‑Based Engineering Solutions Solve It
Xianyu Technology
Xianyu Technology
Jun 29, 2021 · Frontend Development

Design and Implementation of a Cross-Platform Front-End API Solution

The article proposes a unified cross‑platform front‑end API specification and SDK that abstracts differences among WebView, mini‑programs, React Native, Flutter, and other containers, consolidating 55+ APIs for 30+ apps, reducing duplicated code, maintenance, and testing while enabling extensible, reusable functionality across Alibaba’s ecosystem.

APIJavaScriptSDK
0 likes · 8 min read
Design and Implementation of a Cross-Platform Front-End API Solution
Programmer DD
Programmer DD
Jun 27, 2021 · Frontend Development

When Profanity Sneaks into Production Front‑End Code: How to Prevent It

A recent incident where a profane comment accidentally made it into live front‑end code highlights the challenges of maintaining legacy systems, the limitations of current testing practices—especially for night‑mode features—and sparks a discussion on automating checks to catch such issues before release.

code qualityfrontendlegacy systems
0 likes · 3 min read
When Profanity Sneaks into Production Front‑End Code: How to Prevent It
Amap Tech
Amap Tech
Jun 25, 2021 · Frontend Development

Design and Implementation of the Eagle.gl Web 3D Engine for High-Definition Map Rendering

The Eagle.gl Web 3D engine, built atop Three.js, provides a unified 2D/3D GIS platform that efficiently loads, renders, and edits massive point‑cloud, vector, and model map data with real‑time LOD, GPU picking, DEM terrain integration, and configurable styling, supporting AMap’s HD‑map production and future autonomous‑driving simulation.

3D renderingGISThree.js
0 likes · 12 min read
Design and Implementation of the Eagle.gl Web 3D Engine for High-Definition Map Rendering
Taobao Frontend Technology
Taobao Frontend Technology
Jun 24, 2021 · Frontend Development

Rethinking React Hooks: Functional Programming, TypeScript, and Cross‑Framework Insights

This article explores why React moved from class components to the Hooks API, explains its functional‑programming roots, compares Hooks with Redux, Mixins, HOCs, Vue's Composition API, and demonstrates how TypeScript type inference and codata concepts can deepen understanding while providing practical code examples.

Composition APIReactVue
0 likes · 21 min read
Rethinking React Hooks: Functional Programming, TypeScript, and Cross‑Framework Insights
php Courses
php Courses
Jun 24, 2021 · Frontend Development

Top 5 Frontend JavaScript Frameworks in 2021

This article reviews the 2021 top five frontend JavaScript frameworks—React, Vue, Angular, Ember, and Preact—based on Stack Overflow surveys, State of JS, and NPM trends, explaining their origins, features, and adoption by major companies.

AngularEmberJavaScript
0 likes · 9 min read
Top 5 Frontend JavaScript Frameworks in 2021
Alibaba Terminal Technology
Alibaba Terminal Technology
Jun 24, 2021 · Frontend Development

Building a Powerful Docs Site for a Front‑End Graphics Engine with Gatsby

This article walks through the challenges and solutions of creating an integrated, searchable, multilingual documentation website for the Oasis Engine graphics engine, covering the selection of static site generators, the use of Gatsby with TypeDoc and GraphQL, custom plugins for embedding demos, and implementing Algolia DocSearch for global search.

GatsbyGraphQLTypeDoc
0 likes · 18 min read
Building a Powerful Docs Site for a Front‑End Graphics Engine with Gatsby
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Jun 21, 2021 · Frontend Development

Mastering Webpack: From Custom Loaders to Powerful Plugins

This article explains how Webpack loaders work, outlines development guidelines, demonstrates synchronous, asynchronous, raw, and pitching loaders with code examples, and then guides you through creating and configuring custom plugins, covering hooks, async handling, and a practical build‑info plugin.

JavaScriptbuild-toolsfrontend
0 likes · 21 min read
Mastering Webpack: From Custom Loaders to Powerful Plugins
Python Programming Learning Circle
Python Programming Learning Circle
Jun 21, 2021 · Frontend Development

Using Carbon to Generate Beautiful Code Images

This article introduces the free, open‑source Carbon tool, explains its key features such as language support, style customization, and background selection, and provides step‑by‑step instructions for creating and exporting attractive code screenshots in PNG or SVG formats.

CarbonImage Exportcode screenshots
0 likes · 3 min read
Using Carbon to Generate Beautiful Code Images
ELab Team
ELab Team
Jun 20, 2021 · Frontend Development

Understanding React Synthetic Events: Architecture, Code, and Common Pitfalls

This article explains how React synthetic events emulate native DOM events, details the event system architecture, provides core registration and execution code, demonstrates mixing with native events, and discusses the benefits and known issues of the synthetic event model.

Event SystemJavaScriptReact
0 likes · 7 min read
Understanding React Synthetic Events: Architecture, Code, and Common Pitfalls
21CTO
21CTO
Jun 19, 2021 · Frontend Development

Build a Dark Mode Switcher with HTML, CSS, and JavaScript

This step‑by‑step tutorial shows how to create a dark‑mode toggle for a web page using HTML structure, CSS styling (including dark‑mode rules), and a small JavaScript script that adds or removes the dark class on user interaction.

CSSDark ModeHTML
0 likes · 9 min read
Build a Dark Mode Switcher with HTML, CSS, and JavaScript
21CTO
21CTO
Jun 18, 2021 · Frontend Development

Do HTTP/2’s Multiplexing Still Need Image Sprites? Experimental Insights

This article presents a series of experiments comparing HTTP/1.1 and HTTP/2 request merging versus splitting, analyzing how concurrency, multiplexing, and header compression affect page load times for small images, large assets, and JavaScript under various network conditions.

HTTP/2Network ProtocolsWeb Performance
0 likes · 15 min read
Do HTTP/2’s Multiplexing Still Need Image Sprites? Experimental Insights
Sohu Tech Products
Sohu Tech Products
Jun 16, 2021 · Frontend Development

Implementing Promises in JavaScript: Specification, Code Walkthrough, and Interview Guide

This article explains the evolution of JavaScript asynchronous programming, details the Promise/A+ specification, provides step‑by‑step custom Promise implementations with full code examples, covers additional Promise methods, and offers interview questions and best‑practice tips for frontend developers.

AsynchronousJavaScriptPromise
0 likes · 18 min read
Implementing Promises in JavaScript: Specification, Code Walkthrough, and Interview Guide
Efficient Ops
Efficient Ops
Jun 15, 2021 · Frontend Development

Mastering Regex: Essential Patterns for Validating Numbers, Text, and URLs

This guide compiles a comprehensive collection of regular expressions for validating numeric formats, character sets, special inputs like emails and URLs, as well as IP addresses, dates, and other common data patterns, providing clear examples and explanations for developers.

BackendJavaScriptdata format
0 likes · 17 min read
Mastering Regex: Essential Patterns for Validating Numbers, Text, and URLs
58 Tech
58 Tech
Jun 11, 2021 · Frontend Development

Beidou Frontend Monitoring System: Architecture, Challenges, and Solutions

The article details the design, architecture, and operational challenges of the Beidou frontend monitoring platform at 58 Group, covering SDK management, behavior trace logging, front‑back link integration, performance optimizations, minute‑level alerting, and permission management.

Alertingarchitecturefrontend
0 likes · 22 min read
Beidou Frontend Monitoring System: Architecture, Challenges, and Solutions
Baidu App Technology
Baidu App Technology
Jun 9, 2021 · Frontend Development

How to Build a High‑Performance Virtual Tree in Santd for 10k+ Nodes

This article explains the concept of a virtual tree, why it is needed for rendering massive data sets, and provides a step‑by‑step implementation—including flattening the tree, calculating visible nodes, simulating scroll, and decorating the list—demonstrating a speedup from 26 seconds to 0.19 seconds.

JavaScriptSantdVirtualization
0 likes · 11 min read
How to Build a High‑Performance Virtual Tree in Santd for 10k+ Nodes
JD Tech
JD Tech
Jun 8, 2021 · Frontend Development

Design and Usage of JD Logistics Gateway Frontend Plugin Based on Axios

This article explains the design, configuration, and usage of the JD Logistics gateway frontend plugin built on Axios, detailing how it enables zero‑cost integration across multiple environments and account types while providing extensible request/response handling and customizable login redirects.

APIConfigurationJavaScript
0 likes · 9 min read
Design and Usage of JD Logistics Gateway Frontend Plugin Based on Axios
Alibaba Terminal Technology
Alibaba Terminal Technology
Jun 7, 2021 · Fundamentals

What’s New in JavaScript? A Deep Dive into TC39’s Latest Proposals

This article reviews the most recent TC39 proposals—including Realms, RegExp match indices, top‑level await, accessible hasOwnProperty, resizable ArrayBuffers, Intl.DisplayNames V2, extended time‑zone names, and RegExp set notation—explaining their key changes, current stage status, and practical code examples for developers.

ECMAScriptJavaScriptTC39
0 likes · 13 min read
What’s New in JavaScript? A Deep Dive into TC39’s Latest Proposals
New Oriental Technology
New Oriental Technology
Jun 7, 2021 · Frontend Development

Introduction to Unit Testing with Jest and React Testing Library

This article explains the concept of unit testing, introduces the Jest framework and its configuration, demonstrates common APIs, matchers, asynchronous testing, mocking, coverage reporting, and shows how to test React components using React Testing Library with practical code examples.

JavaScriptJestReact Testing Library
0 likes · 18 min read
Introduction to Unit Testing with Jest and React Testing Library
21CTO
21CTO
Jun 5, 2021 · Frontend Development

Top 8 Web Design Trends Shaping 2021: From 3D to Video Integration

The article reviews the eight dominant web design trends of 2021—including 3D graphics, parallax animation, custom illustrations, minimalist layouts, abstract shapes, bold gradients, digital product showcases, and embedded video—explaining how each enhances user engagement in a post‑pandemic digital landscape.

2021 Trends3DUI/UX
0 likes · 6 min read
Top 8 Web Design Trends Shaping 2021: From 3D to Video Integration
Sohu Tech Products
Sohu Tech Products
Jun 2, 2021 · Frontend Development

Understanding Top-Level Await in JavaScript Modules

This article explains how top‑level await, introduced in V8 from version 9.1 and enabled by default in modern browsers, allows developers to use await directly at a module’s top level, simplifying asynchronous code patterns with examples, execution order details, and practical use cases.

AsyncJavaScriptModules
0 likes · 8 min read
Understanding Top-Level Await in JavaScript Modules
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
ByteFE
ByteFE
Jun 1, 2021 · Frontend Development

Embedding a Snake Game into Quill Editor Using DevUI

This article demonstrates how to integrate a canvas‑based snake game into the Quill rich‑text editor by creating a custom toolbar button, defining a SnakeBlot, registering it with Quill, and inserting the game as an embed, all within the DevUI framework for enterprise front‑end solutions.

Custom ToolbarDevUIQuill
0 likes · 9 min read
Embedding a Snake Game into Quill Editor Using DevUI
ByteDance Web Infra
ByteDance Web Infra
May 31, 2021 · Frontend Development

Improving Development Server Startup Speed with Unbundled Development: From Webpack to Vite and Custom Solutions

This article analyses the performance problems of traditional bundled development with Webpack, explores unbundled tools such as Snowpack, WMR and Vite, and details a custom dev‑server implementation that leverages CJS‑to‑ESM conversion, esbuild bundling, plugin architecture, and fast HMR to dramatically reduce startup time for large monorepos.

DevToolsViteesbuild
0 likes · 19 min read
Improving Development Server Startup Speed with Unbundled Development: From Webpack to Vite and Custom Solutions
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 27, 2021 · Frontend Development

How to Generate Excel‑Based Posters in the Browser Without Crashing

This article walks through building a front‑end‑only tool that reads student data from Excel, creates customized poster images using SheetJS, html2canvas, and JSZip, and solves out‑of‑memory crashes by analyzing JavaScript heap usage, refactoring recursive code, and optimizing DOM cloning with ignoreElements.

ExcelJSZipMemory Optimization
0 likes · 8 min read
How to Generate Excel‑Based Posters in the Browser Without Crashing
Xianyu Technology
Xianyu Technology
May 26, 2021 · Cloud Native

Containerized Page Protocol and Cloud Platform for Dynamic Traffic Pages

Xianyu introduced a containerized page protocol and cloud platform that adds a fourth Container layer to its Page‑Section‑Component model, enabling dynamic, low‑code page adjustments, traffic splitting, AB testing, and robust disaster‑recovery through multi‑level caching, thereby cutting development effort and accelerating new business page rollout.

Cloud NativeDynamic UIcloud platform
0 likes · 9 min read
Containerized Page Protocol and Cloud Platform for Dynamic Traffic Pages
ByteFE
ByteFE
May 25, 2021 · Frontend Development

Deep Dive into Webpack Runtime: Chunk, Runtime Modules, and Build Process

This article provides an in‑depth technical analysis of Webpack's runtime, explaining how bundles are composed of business code and runtime, the generation of __webpack_require__ helpers, the mechanisms behind asynchronous chunk loading, hot module replacement, and the internal dependency‑collection process that drives the final asset emission.

Build ProcessChunkRuntime
0 likes · 21 min read
Deep Dive into Webpack Runtime: Chunk, Runtime Modules, and Build Process
Java Architect Essentials
Java Architect Essentials
May 24, 2021 · Frontend Development

Curated Open‑Source Projects for Front‑End and Back‑End Separation in the Java Ecosystem

This article introduces a selection of open‑source projects that demonstrate front‑end and back‑end separation using technologies such as SpringBoot, Vue, Angular, and React, providing practical examples and resources for developers seeking to master full‑stack development and micro‑service architectures.

Vuefrontendfullstack
0 likes · 7 min read
Curated Open‑Source Projects for Front‑End and Back‑End Separation in the Java Ecosystem
ByteDance Web Infra
ByteDance Web Infra
May 21, 2021 · Frontend Development

Understanding the Popularity of TypeScript: History, Features, and Future Outlook

TypeScript’s rapid rise stems from its incremental type system, strategic collaborations, and tooling ecosystem—including DefinitelyTyped, JSX support, and integration with Babel and modern build tools—while its future may involve native type annotations in JavaScript and continued community‑driven evolution.

JavaScriptTypeScriptfrontend
0 likes · 17 min read
Understanding the Popularity of TypeScript: History, Features, and Future Outlook
Java Backend Technology
Java Backend Technology
May 20, 2021 · Frontend Development

How to Build Stunning Big‑Screen Dashboards with FineReport: A Step‑by‑Step Guide

This article walks you through creating impressive big‑screen visual dashboards using FineReport, covering tool selection, data preparation, decision‑report setup, dataset creation, layout design, visual polishing, dynamic effects, and final preview to help you deliver compelling data visualizations efficiently.

Big ScreenDashboardData visualization
0 likes · 6 min read
How to Build Stunning Big‑Screen Dashboards with FineReport: A Step‑by‑Step Guide
WeDoctor Frontend Technology
WeDoctor Frontend Technology
May 18, 2021 · Frontend Development

From Stone Age to Bundless: Mastering Modern Frontend Build Tools

Explore the evolution of frontend build systems—from early manual bundling and IIFE modules through AMD/CMD, webpack, Vite, and rollup—while learning key interview questions, practical optimization techniques, and how to build a comprehensive, future‑ready construction framework for modern web development.

Rollupfrontendwebpack
0 likes · 10 min read
From Stone Age to Bundless: Mastering Modern Frontend Build Tools
JD.com Experience Design Center
JD.com Experience Design Center
May 18, 2021 · Frontend Development

Mastering Dark Mode: Design Principles, Color Contrast, and Accessibility

This article explains the purpose of dark mode, outlines design principles such as layer hierarchy, color contrast, saturation, text opacity, and state representation, and distinguishes dark mode from night mode, providing practical guidelines for creating accessible and visually appealing dark‑theme interfaces.

Dark ModeMaterial DesignUI design
0 likes · 8 min read
Mastering Dark Mode: Design Principles, Color Contrast, and Accessibility
ByteDance ADFE Team
ByteDance ADFE Team
May 13, 2021 · Frontend Development

CSS‑in‑JS in React: Problems with Traditional CSS, Various Styling Approaches and Comparison of Popular Solutions

The article explains why traditional global CSS is problematic for component‑based development, reviews several ways to write styles in React—including BEM‑constrained classNames, inline styling, CSS Modules and css‑loader—then introduces CSS‑in‑JS concepts, demonstrates the Emotion library, compares popular packages and offers practical recommendations for choosing a styling solution.

CSS ModulesEmotionfrontend
0 likes · 15 min read
CSS‑in‑JS in React: Problems with Traditional CSS, Various Styling Approaches and Comparison of Popular Solutions
Xianyu Technology
Xianyu Technology
May 13, 2021 · Frontend Development

Front-End Disaster Recovery for Page Stability

To prevent page failures and white‑screen errors, the team built a front‑end SDK that fetches fallback data from OSS + CDN, offers configurable black/white‑list rules, lightweight validation, and a visual backend, cutting error rates from over 8% to 0.55% and dramatically improving interface stability.

CDNOSSSDK
0 likes · 9 min read
Front-End Disaster Recovery for Page Stability
ByteFE
ByteFE
May 12, 2021 · Frontend Development

Using @vue/reactivity in React: Custom Hooks and HOC for Reactive State

This article demonstrates how to leverage the @vue/reactivity package inside React by creating a custom useReactive hook for function components and a reactiveHoc higher‑order component for class components, explaining the underlying concepts, implementation steps, and practical usage with full code examples.

Custom HooksHigher-Order ComponentReact
0 likes · 7 min read
Using @vue/reactivity in React: Custom Hooks and HOC for Reactive State
Alibaba Terminal Technology
Alibaba Terminal Technology
May 11, 2021 · Frontend Development

How Hook-Based Request Libraries Simplify Data Fetching in Modern Frontend Apps

This article examines the evolution of frontend request libraries—from jQuery Ajax to modern hook-based solutions like useRequest, SWR, and react-query—highlighting their simplified loading state handling, cache mechanisms, refetching, and mutate features, and comparing their design differences with class components.

Data FetchingReactSWR
0 likes · 10 min read
How Hook-Based Request Libraries Simplify Data Fetching in Modern Frontend Apps
21CTO
21CTO
May 6, 2021 · Fundamentals

From Static Pages to Serverless: A Journey Through Web Technology Evolution

This article traces the evolution of web development from the first static page in 1991 through the rise of HTML, CSS, JavaScript, dynamic server‑side technologies, AJAX, SPA, server‑side rendering, Node.js, and emerging trends like bigPipe, React Server Components and Web Components, highlighting the problems each breakthrough solved and the challenges that followed.

frontendhistory
0 likes · 17 min read
From Static Pages to Serverless: A Journey Through Web Technology Evolution
ITPUB
ITPUB
May 5, 2021 · Frontend Development

From Static Pages to SSR: A 30‑Year Web Technology Journey

Spanning three decades, this article traces the evolution of web development from Tim Berners‑Lee’s 1991 static page through the rise of HTML, CSS, JavaScript, PHP, AJAX, SPA frameworks, server‑side rendering, Node.js, and emerging trends like React Server Components, illustrating how each breakthrough addressed the limitations of its predecessors.

BackendJavaScriptSPA
0 likes · 18 min read
From Static Pages to SSR: A 30‑Year Web Technology Journey
Alibaba Cloud Developer
Alibaba Cloud Developer
Apr 29, 2021 · Frontend Development

Revamping Xianyu’s Creator Platform: Front‑End Wins and FY21 Insights

In FY21 I led the Xianyu creator ecosystem as technical PM, building a cross‑functional team, defining goals, and making data‑driven decisions while delivering front‑end innovations such as a rule‑engine CEP, Flutter expansion, backend admin tools, and container strategy, ultimately boosting creator growth and platform value.

Business AnalyticsTeam Buildingfrontend
0 likes · 11 min read
Revamping Xianyu’s Creator Platform: Front‑End Wins and FY21 Insights
Kuaishou Tech
Kuaishou Tech
Apr 29, 2021 · Frontend Development

How Kuaishou Engineered a High‑Traffic Web New Year Event: Risks, Offline Packages & CDN Strategies

This case study details the massive traffic and rich interactive challenges faced by Kuaishou's 2021 New Year web event, analyzes resource download, host performance, and CDN dependencies, and presents tiered preloading, offline‑package splitting, dynamic animation degradation, and domain‑sharding solutions to ensure stability.

CDNWebfrontend
0 likes · 18 min read
How Kuaishou Engineered a High‑Traffic Web New Year Event: Risks, Offline Packages & CDN Strategies
JD.com Experience Design Center
JD.com Experience Design Center
Apr 29, 2021 · Frontend Development

How to Design Reverse Progress Bars When Less Is Better

This article explores the challenges of displaying negative or "less‑is‑better" metrics with progress bars, examines real‑world examples such as remaining storage, countdowns, and expense tracking, and proposes UI patterns like inverted bars, gauges, segmented steps, and clear textual cues to improve user understanding.

UI designUser experiencefrontend
0 likes · 5 min read
How to Design Reverse Progress Bars When Less Is Better
Xianyu Technology
Xianyu Technology
Apr 29, 2021 · Frontend Development

Design and Implementation of a Scalable Article Publishing Tool for Xianyu Community

The project designs a scalable Xianyu article publishing tool that uses a compressed JSON schema based on DingTalk’s we‑editor to store and render extensible, high‑fidelity content, separating text and images, adding plugin‑based cards, and optimizing performance to halve first‑screen load time while supporting future interactive features.

Rich Textcontent managementfrontend
0 likes · 11 min read
Design and Implementation of a Scalable Article Publishing Tool for Xianyu Community
Alibaba Terminal Technology
Alibaba Terminal Technology
Apr 29, 2021 · Frontend Development

Inside ReX Dev: Scalable Frontend Architecture and LowCode at Alibaba Hema

This article details the design and evolution of the ReX Dev front‑end engineering platform used by Alibaba's Hema, covering its layered architecture, robust metadata model, flexible pipeline engine, SPI‑based service extensions, LowCode/ProCode interconversion, and practical guidelines for building a high‑productivity, extensible development platform.

DevelopmentEngineeringLowCode
0 likes · 29 min read
Inside ReX Dev: Scalable Frontend Architecture and LowCode at Alibaba Hema
Aotu Lab
Aotu Lab
Apr 27, 2021 · Fundamentals

Inside SpaceX’s Frontend Architecture and the Latest in Flutter, GitHub & AI

This article explores how SpaceX’s rocket control console is built with JavaScript, examines Flutter 2’s cross‑platform capabilities, details the WebGL techniques behind GitHub’s interactive globe, breaks down logistic regression for recommendation systems, and provides an overview of Huawei’s Harmony OS for developers.

WebGLfrontendharmony os
0 likes · 9 min read
Inside SpaceX’s Frontend Architecture and the Latest in Flutter, GitHub & AI
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Apr 27, 2021 · Frontend Development

Mastering React Error Boundaries: Build a Flexible Error‑Handling Wheel

This tutorial walks through why catching front‑end component errors is essential, demonstrates how to implement a custom React ErrorBoundary with flexible fallback options, reset logic, higher‑order component wrappers, and hooks, and provides complete TypeScript examples and best‑practice summaries.

Error HandlingErrorBoundaryHigher-Order Component
0 likes · 19 min read
Mastering React Error Boundaries: Build a Flexible Error‑Handling Wheel
Taobao Frontend Technology
Taobao Frontend Technology
Apr 26, 2021 · Game Development

How Eva.js Empowers Front‑End Engineers to Build Interactive Games with Minimal Code

Eva.js, an open‑source interactive game engine developed by Alibaba, combines a lightweight ECS architecture, PixiJS rendering, and performance‑focused loading strategies to let front‑end developers create engaging web games with just a few lines of code, while supporting accessibility and state management.

ECSGame EngineJavaScript
0 likes · 9 min read
How Eva.js Empowers Front‑End Engineers to Build Interactive Games with Minimal Code
Alibaba Terminal Technology
Alibaba Terminal Technology
Apr 26, 2021 · Game Development

How Eva.js Empowers Front‑End Engineers to Build Interactive Games at Low Cost

Eva.js, an open‑source interactive game engine developed by Alibaba for two years, lets front‑end engineers create low‑cost, high‑performance web games using familiar HTML/CSS and PixiJS rendering, with ECS architecture, performance‑focused loading, accessibility support, and a lightweight state‑management system.

ECSEva.jsGame Engine
0 likes · 10 min read
How Eva.js Empowers Front‑End Engineers to Build Interactive Games at Low Cost
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Apr 25, 2021 · Frontend Development

Understanding Vue.js mergeOptions: How Merge Strategies Work

This article deeply analyzes Vue.js's mergeOptions function, explaining how merge strategies are defined and applied to options like data, props, hooks, assets, and watchers, with detailed code examples and step‑by‑step breakdowns to help developers understand Vue's option merging mechanics.

Vue.jsfrontendmergeOptions
0 likes · 13 min read
Understanding Vue.js mergeOptions: How Merge Strategies Work
IT Architects Alliance
IT Architects Alliance
Apr 25, 2021 · Frontend Development

How Baidu Revamped Its Search Front‑End Architecture: Lessons for Modern Web Development

This article analyses the evolution of Baidu's search result page front‑end architecture, identifies scalability, coupling, and technology‑stack problems, and presents a three‑layer strategy—foundation, modular middle layer, and componentized top layer—along with concrete implementation steps such as TypeScript adoption, service‑oriented modules, dependency‑injection containers, and SSR performance optimizations.

ComponentizationSSRTypeScript
0 likes · 14 min read
How Baidu Revamped Its Search Front‑End Architecture: Lessons for Modern Web Development
ITFLY8 Architecture Home
ITFLY8 Architecture Home
Apr 24, 2021 · Frontend Development

From URL Entry to Render: A Deep Dive into Browser Internals for Interviews

This article recounts a technical interview where the author explains the complete lifecycle of a browser request—from URL parsing, DNS resolution, TCP handshake, and caching strategies to DOM construction, rendering, and performance optimizations—providing concise answers and practical tips for front‑end developers.

RenderingURLbrowser
0 likes · 14 min read
From URL Entry to Render: A Deep Dive into Browser Internals for Interviews
ByteFE
ByteFE
Apr 23, 2021 · Frontend Development

Curated Technical Articles: Node.js 16 Release, Frontend Performance, CSS @property, WebRTC, Game Development, and More

This roundup presents a selection of recent technical articles covering the Node.js 16 release, front‑end performance optimizations, CSS @property advances, WebRTC transport protocols, game‑engine dark‑mode implementation, Babel deep‑dive, and a new Flutter‑based web rendering engine, each linked for further reading.

CSSFlutterGame Development
0 likes · 4 min read
Curated Technical Articles: Node.js 16 Release, Frontend Performance, CSS @property, WebRTC, Game Development, and More
Dada Group Technology
Dada Group Technology
Apr 23, 2021 · Frontend Development

Accessibility Adaptation for JD Daojia React Native Application

This article details the background, research, identified issues, and step‑by‑step technical solutions—including code examples—for implementing comprehensive accessibility support in the JD Daojia React Native (RN) platform, aiming to enable visually impaired users to complete the full purchase flow.

Mobile DevelopmentRNReact Native
0 likes · 12 min read
Accessibility Adaptation for JD Daojia React Native Application
政采云技术
政采云技术
Apr 20, 2021 · Frontend Development

Deep Dive into CSS Selectors: Types, Usage, and Priority

This article provides a comprehensive analysis of CSS selectors, covering their classification, detailed usage of various selector types, and the calculation of selector priority with practical examples.

CSSPseudo-elementsSelectors
0 likes · 14 min read
Deep Dive into CSS Selectors: Types, Usage, and Priority
ByteFE
ByteFE
Apr 19, 2021 · Frontend Development

Advanced TypeScript and React Patterns: Importing React, Functional Components, Hooks, Props, and Types

This guide covers the essential TypeScript knowledge for React development, demonstrating how to import React, declare functional components with React.FC, use core hooks such as useState, useRef, useEffect, useMemo, create custom hooks, handle defaultProps, choose between type and interface, type props, manage forms and events, work with operators, and apply generic patterns for reusable components.

PropsReactTypeScript
0 likes · 23 min read
Advanced TypeScript and React Patterns: Importing React, Functional Components, Hooks, Props, and Types