BestHub
Sign in
Tagged articles
3130 articles
Page 15 of 32
Alibaba Terminal Technology
Alibaba Terminal Technology
Jun 21, 2022 · Fundamentals

What’s New in ECMAScript? Deep Dive into Recent TC39 Proposals and Stage Advances

This article reviews the latest TC39 proposals—including findLast, Symbol as WeakMap keys, JSON.parse source text access, String.dedent, Import Reflection, RegExp modifiers and atomic operators, and Faster Promise Adoption—detailing their stage progress, implementation requirements, and practical code examples for modern JavaScript development.

ECMAScriptTC39frontend
0 likes · 18 min read
What’s New in ECMAScript? Deep Dive into Recent TC39 Proposals and Stage Advances
KooFE Frontend Team
KooFE Frontend Team
Jun 18, 2022 · Frontend Development

Build a Simple Redux from Scratch and Integrate It with React

This article explains Redux’s core concepts, demonstrates how to implement a basic createStore function in JavaScript, and shows how to integrate it with React using a custom Provider and connect higher‑order component for state sharing across components.

JavaScriptReactRedux
0 likes · 5 min read
Build a Simple Redux from Scratch and Integrate It with React
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Jun 17, 2022 · Frontend Development

Exploring the Future of Frontend: Web3, Serverless, CDN, TypeScript & UX Insights

This article curates key frontend topics—including Web3.0 debates, Serverless lightweight development, CDN design principles, content‑visibility versus lazyload, advanced TypeScript techniques, and user‑experience fundamentals—offering a concise overview for developers seeking to stay ahead of emerging trends.

CDNServerlessTypeScript
0 likes · 3 min read
Exploring the Future of Frontend: Web3, Serverless, CDN, TypeScript & UX Insights
Xingsheng Youxuan Technology Community
Xingsheng Youxuan Technology Community
Jun 17, 2022 · Frontend Development

How Prism Transformed Front‑End Monitoring at Scale: Architecture, Challenges & Insights

This article details the design, challenges, and solutions behind Prism, a self‑built front‑end monitoring platform that collects multi‑device SDK data, processes it through Kafka, Flink and ClickHouse, visualizes metrics, integrates with A/B testing, and outlines future enhancements for broader enterprise adoption.

AB testingfrontendmonitoring
0 likes · 14 min read
How Prism Transformed Front‑End Monitoring at Scale: Architecture, Challenges & Insights
Architect's Guide
Architect's Guide
Jun 17, 2022 · Frontend Development

Top Vue Open‑Source Projects: CMS, Generators, UI Libraries, and More

This article surveys the most useful and mature Vue open‑source projects—including CMS platforms, static site generators, e‑commerce storefronts, visual editors, UI component libraries, and development tools—highlighting their key features, community support, documentation quality, and contribution guidelines to help developers choose suitable tools.

UI componentsVuecommunity
0 likes · 12 min read
Top Vue Open‑Source Projects: CMS, Generators, UI Libraries, and More
Programmer DD
Programmer DD
Jun 15, 2022 · Frontend Development

How to Efficiently Render 100,000 Records in the Frontend: Tips and Code

This article walks through creating a simple Node server, building a basic HTML/JS front‑end, and applying performance techniques such as pagination with setTimeout, requestAnimationFrame, document fragments, and lazy‑loading to render massive data sets smoothly.

frontendlazy loadingrequestAnimationFrame
0 likes · 11 min read
How to Efficiently Render 100,000 Records in the Frontend: Tips and Code
Alibaba Terminal Technology
Alibaba Terminal Technology
Jun 15, 2022 · Frontend Development

How Serverless and BFF Transform Frontend Development at Ant Group

This article explores Ant Group's front‑end R&D system, the challenges of large‑scale financial applications, and how a serverless, low‑code platform with BFF, function‑level deployment, and documentation‑as‑code practices can boost efficiency, safety, and scalability.

BFFFunction as a ServiceLow‑code platform
0 likes · 10 min read
How Serverless and BFF Transform Frontend Development at Ant Group
The Dominant Programmer
The Dominant Programmer
Jun 15, 2022 · Frontend Development

How to Enable Markdown Online Editing in Vue Using mavon-editor

This guide walks through installing the mavon-editor package, globally registering it in a Vue project, creating a component with markdown binding, configuring props, customizing toolbars, handling image uploads, and using keyboard shortcuts to provide a full-featured online markdown editor.

Vueeditorfrontend
0 likes · 9 min read
How to Enable Markdown Online Editing in Vue Using mavon-editor
政采云技术
政采云技术
Jun 15, 2022 · Frontend Development

Applying Data Statistics to Frontend Performance Detection and Optimization

This article explains how a self‑built performance testing platform leverages data‑statistical models, such as scoring and interval models based on normal distribution and percentile analysis, to quantify web‑page metrics, guide automated and semi‑automated optimizations, and integrate with CI/CD workflows for frontend development.

Data StatisticsLighthouseModeling
0 likes · 24 min read
Applying Data Statistics to Frontend Performance Detection and Optimization
Alipay Experience Technology
Alipay Experience Technology
Jun 14, 2022 · Frontend Development

How Ant Group’s Serverless Front‑End Platform Boosts Large‑Scale Development

This talk explains Ant Group’s serverless‑based front‑end platform, detailing the current front‑end architecture, challenges of large‑scale financial services, and three core efficiency ideas—document‑as‑code, function‑level deployment, and integrated plugin capabilities—to streamline development and ensure safe production.

BFFServerlessdocument-as-code
0 likes · 9 min read
How Ant Group’s Serverless Front‑End Platform Boosts Large‑Scale Development
TikTok Frontend Technology Team
TikTok Frontend Technology Team
Jun 14, 2022 · Frontend Development

Implementing Accessibility (A11y) in Semi Design: Guidelines and Best Practices

This article explains why accessibility is essential for UI component libraries, describes the main types of disabilities, and provides concrete Semi Design guidelines—including color contrast, keyboard navigation, semantic markup, media handling, and layout recommendations—to create inclusive front‑end experiences.

DesignKeyboardUI components
0 likes · 15 min read
Implementing Accessibility (A11y) in Semi Design: Guidelines and Best Practices
Laravel Tech Community
Laravel Tech Community
Jun 13, 2022 · Frontend Development

The Rise and Decline of jQuery: From Web 2.0 Dominance to Modern Front‑End Landscape

This article traces jQuery’s emergence as the de‑facto library that simplified DOM manipulation and cross‑browser compatibility during the Web 2.0 era, examines its widespread adoption and subsequent performance gains from removal, and explains why modern standards, HTML5 and MVVM frameworks have reduced its relevance today.

HTML5JavaScriptMVVM
0 likes · 12 min read
The Rise and Decline of jQuery: From Web 2.0 Dominance to Modern Front‑End Landscape
macrozheng
macrozheng
Jun 12, 2022 · Frontend Development

Why jQuery’s Dominance Is Fading: From Web 2.0 Star to Legacy Tool

This article traces jQuery’s rise as the go‑to library during Web 2.0, examines recent moves by major sites to drop it, explains its original technical advantages, and analyzes how HTML5, MVVM frameworks and modern frontend stacks have reduced its relevance while it still powers a large share of the web.

HTML5JavaScriptMVVM
0 likes · 14 min read
Why jQuery’s Dominance Is Fading: From Web 2.0 Star to Legacy Tool
Java Captain
Java Captain
Jun 11, 2022 · Frontend Development

Full-Stack Dashboard Implementation Using Echarts, Java Web Backend, and JSON Data

This article presents a step-by-step guide to building a full-screen dashboard for LED displays, detailing requirement analysis, deployment options, overall architecture, key front‑end HTML/CSS layout, Echarts visualizations, back‑end Java REST API, JSON data handling, and configuration instructions.

BackendEChartsJSON
0 likes · 10 min read
Full-Stack Dashboard Implementation Using Echarts, Java Web Backend, and JSON Data
Top Architect
Top Architect
Jun 10, 2022 · Frontend Development

Front‑end Gray Release Strategies and Implementation Guide

This article explains the concept of gray (canary) releases for front‑end projects, compares several practical deployment schemes—including simple Nginx weighting, Nginx + Lua + Redis, server‑side rendering, client‑side annotation, and a full Nginx + backend + Redis + SDK solution—provides code samples, Docker‑compose instructions, and operational tips for rollout and rollback.

DeploymentDockerfrontend
0 likes · 12 min read
Front‑end Gray Release Strategies and Implementation Guide
Zuoyebang Tech Team
Zuoyebang Tech Team
Jun 9, 2022 · Frontend Development

Re‑engineering a Live‑Streaming Frontend to Cut Black‑Screen Errors & Boost Performance

Facing fragmented devices, high memory usage, and unreliable signaling, the Zuoyebang live‑streaming frontend was redesigned with container‑based isolation, a modular SDK, and state‑synchronization mechanisms, resulting in timely memory reclamation, reduced CPU load, and dramatically lower black‑screen incidents.

Container ArchitectureMemory ManagementWebView
0 likes · 13 min read
Re‑engineering a Live‑Streaming Frontend to Cut Black‑Screen Errors & Boost Performance
IT Architects Alliance
IT Architects Alliance
Jun 8, 2022 · Frontend Development

Gray Release Strategies for Large Frontend Projects

This article explains the concept of gray release, compares several practical rollout schemes—including simple Nginx weighting, Nginx + Lua + Redis, server‑side rendering split, client‑side conditional compilation, and a full Nginx + backend + Redis + SDK solution—provides implementation details, code examples, and operational tips for safely deploying new features to subsets of users.

feature flagfrontendgray release
0 likes · 11 min read
Gray Release Strategies for Large Frontend Projects
vivo Internet Technology
vivo Internet Technology
Jun 8, 2022 · Frontend Development

Implementation and Integration of a Lightweight Vue Page‑Element Code Mapping Plugin

A lightweight Vue plugin injects file‑path and line‑number metadata into each element during build, lets developers click any page component (with a modifier key) to send a request to a local Node server that launches VSCode directly at the exact source line, streamlining navigation in large Webpack or Vite projects.

VSCodeVitecode mapping
0 likes · 15 min read
Implementation and Integration of a Lightweight Vue Page‑Element Code Mapping Plugin
Architect
Architect
Jun 7, 2022 · Frontend Development

Front‑end Gray Release Strategies and Practical Implementation

This article explains what gray (canary) release is, describes several practical front‑end gray‑release schemes—including simple Nginx weighting, Nginx + Lua + Redis, server‑side rendering routing, and a full Nginx + backend + Redis + frontend SDK solution—provides code snippets, Docker commands and operational tips for safely rolling out new features.

DockerJavaScriptfrontend
0 likes · 14 min read
Front‑end Gray Release Strategies and Practical Implementation
Alibaba Terminal Technology
Alibaba Terminal Technology
Jun 7, 2022 · Frontend Development

How DX’s New IDE Transforms Mobile Template Development at Alibaba

This article explains how DinamicX (DX) evolved from a limited template platform to a full‑cycle IDE built on VSCode and OpenSumi, detailing its architecture, feature set, workflow stages, code intelligence, preview tools, and future technical directions for improving performance, collaboration, and cross‑platform development.

DXIDEOpenSumi
0 likes · 20 min read
How DX’s New IDE Transforms Mobile Template Development at Alibaba
ELab Team
ELab Team
Jun 3, 2022 · Frontend Development

Master Lit: A Lightweight Frontend Library for Building Web Components

This article provides a comprehensive overview of Lit, covering its core concepts, key features, decorators, templating, styling, slots, event communication, lifecycle, directives, mixins, controllers, SSR support, and the surrounding ecosystem, offering practical code examples for developers.

JavaScriptLibraryLit
0 likes · 21 min read
Master Lit: A Lightweight Frontend Library for Building Web Components
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Jun 3, 2022 · Frontend Development

Key Frontend Topics: Promises, Code Review, Race Conditions, Standards, Webpack

Explore a curated set of frontend development articles covering the evolution of asynchronous JavaScript with Promises and async/await, best practices for code reviews, handling race conditions in React, establishing comprehensive frontend standards, the quirks of JavaScript's with statement, and advanced webpack splitChunks and manifest optimization techniques.

AsynchronousCode reviewfrontend
0 likes · 4 min read
Key Frontend Topics: Promises, Code Review, Race Conditions, Standards, Webpack
Java High-Performance Architecture
Java High-Performance Architecture
Jun 3, 2022 · R&D Management

How to Align Your Role and Grow as a Front‑End Engineer: 5 Key Lessons

In this reflective piece the author shares five practical insights from two years at Alibaba, covering how to define personal positioning, maintain forward compatibility, avoid flawed designs, let specialists focus on their expertise, and balance boundaries with collaboration to sustain both personal and team growth.

Career Developmentfrontendprofessional growth
0 likes · 13 min read
How to Align Your Role and Grow as a Front‑End Engineer: 5 Key Lessons
Baidu Geek Talk
Baidu Geek Talk
Jun 2, 2022 · Frontend Development

How to Boost Mini Program Performance: Metrics, Diagnosis, and Optimization Strategies

This article explains why mini‑program performance matters, defines key startup metrics such as FMP and TTI, describes the Baidu monitoring platform, and provides a step‑by‑step guide to identify and resolve bottlenecks through package splitting, early data requests, network optimizations, and render‑time reductions.

frontendoptimizationstartup metrics
0 likes · 14 min read
How to Boost Mini Program Performance: Metrics, Diagnosis, and Optimization Strategies
ByteFE
ByteFE
Jun 1, 2022 · Frontend Development

Understanding and Implementing Distance Fields in WebGL (Part 2)

This article explains the concept of distance fields, shows how to compute distance fields for rectangles, lines, and line segments in GLSL, and demonstrates sampling techniques and curve rendering using WebGL shaders with complete code examples.

Distance FieldGraphicsShader
0 likes · 9 min read
Understanding and Implementing Distance Fields in WebGL (Part 2)
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
May 31, 2022 · Frontend Development

Fin Line Height Fix Tool: Solving Visual Fidelity Issues in Design-Development Collaboration

The article introduces the Fin Line Height Fix Tool, an open‑source solution from NetEase’s Dolphin team that resolves visual fidelity problems caused by inconsistent font heights between design tools and implementation, offering Figma and Sketch plugins plus iOS, Android, and React Native code to ensure pixel‑level line‑height consistency and streamline designer‑developer collaboration.

AndroidSketchUI/UX
0 likes · 8 min read
Fin Line Height Fix Tool: Solving Visual Fidelity Issues in Design-Development Collaboration
ELab Team
ELab Team
May 27, 2022 · Frontend Development

Build a QR Code Chrome Extension with Svelte: A Step‑by‑Step Guide

This article walks through creating a Chrome QR‑code extension using Svelte, covering project setup with SvelteKit, manifest configuration for MV3, component development, reactive logic, download handling, custom adapter creation to satisfy CSP, build steps, debugging, and the final result.

AdapterChrome ExtensionMV3
0 likes · 12 min read
Build a QR Code Chrome Extension with Svelte: A Step‑by‑Step Guide
DaTaobao Tech
DaTaobao Tech
May 26, 2022 · Frontend Development

Measuring JavaScript Code Coverage and Reducing Dead Code in Front‑end Projects

By using Chrome DevTools and Istanbul/NYC to measure JavaScript coverage, developers can detect dead and low‑usage code, then convert such modules into dynamic imports via build plugins, enabling tree‑shaking and code‑splitting that reduces bundle size and speeds up first‑screen rendering.

Dead CodeInstrumentationTree Shaking
0 likes · 11 min read
Measuring JavaScript Code Coverage and Reducing Dead Code in Front‑end Projects
Sohu Tech Products
Sohu Tech Products
May 25, 2022 · Frontend Development

Comprehensive Guide to the React Ecosystem: Tools, Libraries, and Best Practices

This article provides an extensive overview of the modern React ecosystem, covering project setup options, state management, routing, styling, component libraries, animation, data fetching, testing, type checking, internationalization, and many other tools and best‑practice recommendations for frontend developers.

ReactState ManagementStyling
0 likes · 20 min read
Comprehensive Guide to the React Ecosystem: Tools, Libraries, and Best Practices
政采云技术
政采云技术
May 24, 2022 · Frontend Development

An Overview of Module Federation

This article introduces Webpack 5's Module Federation feature, explains its business scenarios, configuration, underlying plugin architecture, and runtime mechanics, provides a practical Vue 3 demo with code snippets, and discusses usage patterns and benefits for micro‑frontend development.

JavaScriptModule FederationVue3
0 likes · 13 min read
An Overview of Module Federation
Sensors Frontend
Sensors Frontend
May 24, 2022 · Frontend Development

Must‑Read Frontend Articles: CSS, JavaScript, React, WebAssembly & More

This curated list highlights the latest breakthroughs in frontend engineering, covering component‑driven responsive design, the JavaScript pipeline operator, React's useEvent hook, WebContainer architecture, IEEE‑754 double‑precision floating‑point details, native debounce in React, low‑code visual systems, object key ordering, Blink rendering, and a comparative review of browser code editors.

IEEE-754WebAssemblycode editors
0 likes · 5 min read
Must‑Read Frontend Articles: CSS, JavaScript, React, WebAssembly & More
Alipay Experience Technology
Alipay Experience Technology
May 24, 2022 · Frontend Development

How to Quickly Build 3D Virtual Avatars with Front‑End Techniques

This article explains the end‑to‑end front‑end workflow for creating real‑time 3D virtual avatars using the Oasis engine, covering glTF asset handling, model and texture replacement, bone animation mapping, inverse kinematics, physics integration, AI enhancements, and a low‑code development approach.

3D avatarsVirtual Humansfrontend
0 likes · 9 min read
How to Quickly Build 3D Virtual Avatars with Front‑End Techniques
Programmer DD
Programmer DD
May 24, 2022 · Frontend Development

How GOV.UK Boosted Performance by Dropping jQuery: 31% JS Size Reduction

Matt Hobbs, the front‑end lead at GOV.UK, removed jQuery from 13 applications, cutting JavaScript size by up to 49 % and improving key performance metrics such as processing time, First CPU Idle, and long‑task duration, even under poor network conditions.

Technical DebtWeb Optimizationfrontend
0 likes · 3 min read
How GOV.UK Boosted Performance by Dropping jQuery: 31% JS Size Reduction
DeWu Technology
DeWu Technology
May 23, 2022 · Frontend Development

Micro‑Frontend Architecture with Qiankun and Module Federation: Design, Implementation, and Performance

The team replaced a heavy SPA‑plus‑iframe workbench with a micro‑frontend architecture using Qiankun and Webpack 5 Module Federation, enabling independent development, caching, sandboxed isolation, and remote component integration, which cut load time, improved stability, and accelerated releases while highlighting migration challenges.

Module Federationfrontendmicro-frontend
0 likes · 19 min read
Micro‑Frontend Architecture with Qiankun and Module Federation: Design, Implementation, and Performance
ELab Team
ELab Team
May 21, 2022 · Frontend Development

Mastering VS Code Extension Development: From Electron Basics to Custom Plugins

This article explains how VS Code extensions work by detailing Electron’s architecture, the multi‑process model, and the plugin loading mechanism, then walks through building a custom extension that adds a right‑click command to generate a Lynx component scaffold, complete with code snippets and configuration steps.

Extension DevelopmentNode.jsTypeScript
0 likes · 17 min read
Mastering VS Code Extension Development: From Electron Basics to Custom Plugins
ByteFE
ByteFE
May 20, 2022 · Frontend Development

Curated Tech Updates: Web Interoperability Group, Chrome 102 DevTools, Performance Optimizations, Node.js for Microservices, and More

This newsletter highlights the formation of a JavaScript runtime interoperability group, new Chrome 102 DevTools features, Google’s performance‑boosting private prefetch proxy, a comparison of Vue and React performance, Node.js advantages for microservices, and several recent articles on frontend tooling, image optimization, and modern JavaScript language features.

Chrome DevToolsNode.jsWeb Interoperability
0 likes · 7 min read
Curated Tech Updates: Web Interoperability Group, Chrome 102 DevTools, Performance Optimizations, Node.js for Microservices, and More
Yunxuetang Frontend Team
Yunxuetang Frontend Team
May 20, 2022 · Frontend Development

Master Frontend Challenges: Race Conditions, Encryption, Low‑Code, Rust, AI Deepfakes

This roundup explores key frontend topics—including race‑condition handling in React, client‑side field‑level encryption with Node.js and MongoDB, iQIYI’s low‑code engine, leveraging Rust for WebAssembly, performance analysis of JavaScript frameworks using Google CrUX, and the risks of AI‑generated deepfake videos.

MongoDBWebAssemblydeepfake
0 likes · 4 min read
Master Frontend Challenges: Race Conditions, Encryption, Low‑Code, Rust, AI Deepfakes
macrozheng
macrozheng
May 20, 2022 · Frontend Development

Boost Your API Testing: Visualize JSON with JsonHero & JsonVisio

Swagger’s poor JSON handling can hinder API testing, but two sleek visualization tools—JsonHero and JsonVisio—offer formatting, editing, tree views, and easy installation, enabling developers to efficiently view and manipulate JSON data directly from Swagger or standalone.

JSONJsonHeroJsonVisio
0 likes · 7 min read
Boost Your API Testing: Visualize JSON with JsonHero & JsonVisio
Shopee Tech Team
Shopee Tech Team
May 19, 2022 · Frontend Development

ASLINE: A Visual Low‑Code Platform for Efficient Front‑End Development in Shopee Supply Chain WMS

The ASLINE visual low‑code platform lets Shopee Supply Chain engineers turn Figma designs into editable Vue pages by automatically recognizing components, mapping them to internal libraries, generating API request code, and exporting semi‑finished code, achieving roughly 92% recognition accuracy and cutting development time by about 80%.

Component RecognitionVueapi-integration
0 likes · 27 min read
ASLINE: A Visual Low‑Code Platform for Efficient Front‑End Development in Shopee Supply Chain WMS
ByteFE
ByteFE
May 18, 2022 · Frontend Development

Understanding WebGL: GPU Basics, Shaders, and Practical Code Examples

This article introduces WebGL fundamentals for frontend developers, explaining GPU versus CPU, GLSL shaders, and how JavaScript prepares data, followed by step‑by‑step code examples of fragment and vertex shaders, custom primitives, and using the gl‑renderer library to render graphics.

GPUGraphicsJavaScript
0 likes · 11 min read
Understanding WebGL: GPU Basics, Shaders, and Practical Code Examples
ELab Team
ELab Team
May 17, 2022 · Frontend Development

Unlocking Web Audio: Mastering Audio DSP with the Web Audio API

This article introduces the Web Audio API, explains core audio DSP concepts such as signal processing, time and frequency domains, and details the main AudioContext and AudioNode components, followed by practical examples, code snippets, and references for building sophisticated web‑based audio applications.

Audio DSPAudioNodeJavaScript
0 likes · 8 min read
Unlocking Web Audio: Mastering Audio DSP with the Web Audio API
政采云技术
政采云技术
May 17, 2022 · Frontend Development

Performance Optimization: Image Compression, Loading Strategies, and Format Selection

This article explains why image resources dominate front‑end performance, describes how binary depth relates to color representation, compares common image formats (JPEG, PNG‑8/24, SVG, WebP, Base64), and provides practical techniques such as compression tools, CDN/OSS deployment, and lazy‑loading code to dramatically improve page load speed.

CDNOSSWeb Performance
0 likes · 12 min read
Performance Optimization: Image Compression, Loading Strategies, and Format Selection
Alibaba Terminal Technology
Alibaba Terminal Technology
May 17, 2022 · Frontend Development

How UC Browser’s New Web Container Tackles Video, Audio, and UI Limits

This article shares the author’s reflections on designing UC Browser’s next‑generation Web container, outlining typical boundary challenges—such as complex video/audio control, high‑performance long lists, parallax effects, multi‑tab navigation, and local pop‑ups—and argues that extending the container with private APIs can bridge these gaps, improving performance and user experience.

MobileWebViewfrontend
0 likes · 27 min read
How UC Browser’s New Web Container Tackles Video, Audio, and UI Limits
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
May 16, 2022 · Frontend Development

How to Prevent Race Conditions in React Data Fetching

This article explains what race conditions are in front‑end web development, demonstrates the issue with a React demo fetching articles, and walks through step‑by‑step solutions using custom hooks, useEffect cleanup, and AbortController to safely cancel outdated requests and avoid stale data rendering.

AbortControllerCustom HookData Fetching
0 likes · 10 min read
How to Prevent Race Conditions in React Data Fetching
WecTeam
WecTeam
May 13, 2022 · Frontend Development

Top Frontend Picks: Prefetch‑Powered H5 Offline Packages, 2022 React Ecosystem, and React 18 Transition Deep Dive

This week’s WecTeam Frontend Weekly highlights a prefetch‑driven H5 offline‑package strategy for the Jingxi app, a comprehensive review of the 2022 React ecosystem, and an in‑depth look at React 18’s Transition API, offering practical insights to boost web performance and developer productivity.

Transitionfrontendoffline package
0 likes · 3 min read
Top Frontend Picks: Prefetch‑Powered H5 Offline Packages, 2022 React Ecosystem, and React 18 Transition Deep Dive
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
May 13, 2022 · Frontend Development

Recreating the “声生不息” Logo Using Pure CSS with Gradient, Clip‑Path, and Variable‑Based Color Switching

This article demonstrates how to recreate the “声生不息” program logo using only native CSS and a small amount of JavaScript, covering gradient stripes, clip‑path shaping, background‑clip text effects, CSS variables for color toggling, and detailed code snippets for each implementation step.

Background-ClipCSSJavaScript
0 likes · 19 min read
Recreating the “声生不息” Logo Using Pure CSS with Gradient, Clip‑Path, and Variable‑Based Color Switching
Python Programming Learning Circle
Python Programming Learning Circle
May 11, 2022 · Frontend Development

Comprehensive Guide to Configuring Chrome DevTools for Python Web Scraping

This article provides a detailed walkthrough of Chrome DevTools configuration and usage—including global settings, shortcuts, element inspection, network throttling, and code extraction—to help Python developers efficiently collect web data, with step‑by‑step instructions, screenshots, and code snippets.

Chrome DevToolsPythonWeb Scraping
0 likes · 9 min read
Comprehensive Guide to Configuring Chrome DevTools for Python Web Scraping
Alibaba Terminal Technology
Alibaba Terminal Technology
May 11, 2022 · Frontend Development

How React Server Components May Transform Frontend Development

This article examines the emerging React Server Components feature, explains the limitations of traditional API‑driven front‑end/back‑end separation, and outlines how server‑rendered components can reduce bundle size, eliminate request waterfalls, and lower collaboration costs for modern web applications.

APIReactServer Components
0 likes · 14 min read
How React Server Components May Transform Frontend Development
ByteDance Web Infra
ByteDance Web Infra
May 9, 2022 · Frontend Development

Web Infra Live Interview – Full Translation on the Future of Frontend and Vercel

This article provides a complete English translation of a 1.5‑hour live interview where Vercel’s Director of Developer Relations discusses the evolution of frontend development, edge networks, rendering strategies such as CSR, SSR, SSG, ISR, RSC, the Vercel platform workflow, and the role of Rust, WebAssembly, and SWC in modern web tooling.

Next.jsRustSSR
0 likes · 36 min read
Web Infra Live Interview – Full Translation on the Future of Frontend and Vercel
Top Architect
Top Architect
May 7, 2022 · Fundamentals

Understanding Low‑Code Implementation: Principles, Front‑End and Back‑End Solutions

This article explains the core concepts of low‑code platforms, why visual editing requires declarative programming, compares declarative and imperative approaches, and details practical front‑end (using JSON‑to‑React via the open‑source AMIS framework) and back‑end storage and logic implementations with code examples.

Backendamisarchitecture
0 likes · 34 min read
Understanding Low‑Code Implementation: Principles, Front‑End and Back‑End Solutions
Programmer DD
Programmer DD
May 7, 2022 · Frontend Development

Boost Your VSCode Productivity: 60+ Must-Have Extensions for Frontend Developers

This guide introduces over 60 essential VSCode extensions, organized into categories such as appearance, functionality, efficiency, formatting, and miscellaneous tools, helping developers enhance their coding experience, streamline workflows, and customize the editor for front‑end development without sacrificing performance.

DevelopmentExtensionsVSCode
0 likes · 21 min read
Boost Your VSCode Productivity: 60+ Must-Have Extensions for Frontend Developers
Yunxuetang Frontend Team
Yunxuetang Frontend Team
May 6, 2022 · Frontend Development

Top Must-Read Articles on Vue Performance, Micro‑Frontends, and More

This curated collection highlights essential reads on front‑end performance optimization, reliable metrics, fault‑postmortem practices, insights from Twitter’s source code, the future of micro‑frontends, and building a simple Java editor, offering developers practical guidance and emerging trends across the web development landscape.

Fault PostmortemWeb Developmentfrontend
0 likes · 3 min read
Top Must-Read Articles on Vue Performance, Micro‑Frontends, and More
FunTester
FunTester
May 6, 2022 · Frontend Development

How to Determine Whether a Bug Belongs to the Frontend or Backend

The article explains the differences between frontend and backend development, uses a restaurant analogy to illustrate each side, and provides a step‑by‑step method—including packet capture and HTTP status checks—to identify whether a bug originates from the frontend or the backend.

Web Developmentbug diagnosisdebugging
0 likes · 4 min read
How to Determine Whether a Bug Belongs to the Frontend or Backend
IT Services Circle
IT Services Circle
May 5, 2022 · Frontend Development

Understanding State Management in Frontend Development

State management, the core of frontend development, involves defining state as data changes, handling asynchronous pre‑state logic, and linking post‑state updates to view rendering, with implementations ranging from framework APIs like React’s setState to reactive proxies in Vue and global stores such as Redux, MobX, and Vuex.

MobXReduxState Management
0 likes · 13 min read
Understanding State Management in Frontend Development
IT Architects Alliance
IT Architects Alliance
May 4, 2022 · Fundamentals

Understanding Low-Code Implementation: Principles, Frontend Rendering, Backend Storage and Workflow

This article explains the core principles of low‑code platforms, showing how visual (declarative) editing distinguishes low‑code from traditional code, and reviews various frontend and backend implementation schemes—including JSON‑to‑React rendering, storage strategies, JavaScript logic, and workflow engines—while highlighting their advantages and limitations.

BackendDSLDeclarative
0 likes · 34 min read
Understanding Low-Code Implementation: Principles, Frontend Rendering, Backend Storage and Workflow
KooFE Frontend Team
KooFE Frontend Team
May 3, 2022 · Frontend Development

Build a Simple React Global State Manager Using ES6 Proxy

This article demonstrates how to leverage the ES6 Proxy object to create a lightweight global state management solution for React, walking through a counter example, custom hooks, listener tracking, and a reusable store creator for seamless component updates.

JavaScriptReactfrontend
0 likes · 7 min read
Build a Simple React Global State Manager Using ES6 Proxy
php Courses
php Courses
Apr 29, 2022 · Frontend Development

20 Commonly Used ES6 Techniques for Frontend Development

This article presents twenty practical ES6 tricks—including array shuffling, character filtering, string reversal, numeric base conversion, object merging, strict vs. loose equality, destructuring, variable swapping, palindrome checking, optional chaining, ternary operator, random selection, object freezing, duplicate removal, decimal precision, array clearing, color conversion, min‑max extraction, nullish coalescing, and false‑value filtering—each illustrated with concise code examples.

CodingTipsJavaScriptWebDevelopment
0 likes · 4 min read
20 Commonly Used ES6 Techniques for Frontend Development
JD Tech
JD Tech
Apr 29, 2022 · Frontend Development

Cross‑Platform Frontend Evolution and Low‑Code Flutter Implementation

This article examines the evolution of cross‑platform frontend technologies, outlines key criteria for selecting a solution, compares major approaches such as WebView, native rendering, and self‑rendering, and presents a practical low‑code, Flutter‑based implementation that delivers fast, consistent multi‑device applications.

FlutterSoftware Architecturefrontend
0 likes · 11 min read
Cross‑Platform Frontend Evolution and Low‑Code Flutter Implementation
Alibaba Terminal Technology
Alibaba Terminal Technology
Apr 27, 2022 · Frontend Development

How Chrome 101’s Priority Hints and FedCM Can Boost Web Performance and Privacy

Chrome 101 introduces Priority Hints for fine‑grained resource loading control and the Federated Credentials Management API for cookie‑less third‑party login, but both features are still experimental, lack cross‑browser support, and raise practical challenges for developers seeking performance gains and privacy improvements.

ChromeFederated Credential ManagementPriority Hints
0 likes · 14 min read
How Chrome 101’s Priority Hints and FedCM Can Boost Web Performance and Privacy
ELab Team
ELab Team
Apr 26, 2022 · Frontend Development

Understanding JavaScript Memory Leaks and V8 Garbage Collection

This article explains how JavaScript's garbage collector works, outlines typical memory‑leak scenarios, and provides practical techniques—such as reducing global variables, cleaning DOM references, and managing event listeners—to improve performance and avoid UI jank.

JavaScriptV8frontend
0 likes · 17 min read
Understanding JavaScript Memory Leaks and V8 Garbage Collection
Qunhe Technology User Experience Design
Qunhe Technology User Experience Design
Apr 26, 2022 · Frontend Development

How Manycore Design Unified Our UI Components Across Teams

This article outlines the evolution of Manycore Design, the in‑house design system created by Qunhe, detailing its transition from third‑party libraries to a unified component library, the four‑year development process, and the ongoing efforts to expand its ecosystem and ensure consistent product standards.

Component LibraryProduct Developmentdesign system
0 likes · 3 min read
How Manycore Design Unified Our UI Components Across Teams
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Apr 24, 2022 · Frontend Development

Exploring Modern Front‑End Technologies and Security Practices

This article surveys a range of front‑end topics—including alternative web‑framework solutions, the rise of pnpm, JavaScript stack memory, TypeScript overloads, integrating Golang with Node.js, innovative development approaches, and essential network security insights—providing concise technical overviews and references.

JavaScriptTypeScriptWeb Development
0 likes · 4 min read
Exploring Modern Front‑End Technologies and Security Practices
Youku Technology
Youku Technology
Apr 22, 2022 · Frontend Development

How Youku Cut Mobile UI Development Time by 30% with GaiaX & GaiaStudio

Facing the challenge of duplicated UI code across multiple devices, Youku’s tech team built a cross‑platform dynamic template system—including GaiaSketch, GaiaX, and GaiaStudio—that streamlines design‑to‑code workflows, reduces development effort by about 30%, and open‑sources the tools for the broader community.

GaiaStudioGaiaXUI Development
0 likes · 13 min read
How Youku Cut Mobile UI Development Time by 30% with GaiaX & GaiaStudio
JD Tech
JD Tech
Apr 21, 2022 · Cloud Native

Open Source Construction and Sustainable Development – JD Retail Technical Salon Recap

The JD Retail Technical Salon held on April 8, 2022 brought together internal and external experts to share experiences on open‑source projects, cloud‑native messaging, frontend and backend frameworks, and compliance, fostering sustainable open‑source ecosystems and encouraging community participation across JD’s engineering teams.

Backendcompliancefrontend
0 likes · 6 min read
Open Source Construction and Sustainable Development – JD Retail Technical Salon Recap
58 Tech
58 Tech
Apr 21, 2022 · Frontend Development

Interview with Li Yi on Building 58 Group’s Large Front‑End Technology Service System

In this interview, Li Yi, head of 58 Group’s Front‑End Technology Department, explains how the company built its large‑scale front‑end service system—including a Hybrid permission platform, a React Native hot‑update platform, and the Beidou monitoring system—while discussing cross‑platform frameworks, performance challenges, low‑code adoption, and advice for newcomers.

Fluttercross‑platformfrontend
0 likes · 11 min read
Interview with Li Yi on Building 58 Group’s Large Front‑End Technology Service System
Yiche Technology
Yiche Technology
Apr 19, 2022 · Frontend Development

Vue vs React: Technical Comparison and Project Selection Guide

This article compares Vue and React by examining their template syntax, virtual DOM implementations, update strategies, data binding mechanisms, and performance characteristics, offering practical guidance on choosing the appropriate framework for projects of varying size and browser compatibility requirements.

ReactVirtual DOMVue
0 likes · 10 min read
Vue vs React: Technical Comparison and Project Selection Guide
JavaScript
JavaScript
Apr 18, 2022 · Frontend Development

Master JavaScript’s Array.at(): Simplify Access to Elements from Both Ends

This article explains how JavaScript arrays are zero‑based, demonstrates traditional bracket indexing, introduces the new Array.prototype.at() method for both positive and negative indices, and shows concise code examples that make accessing the first, middle, and last elements easier and more readable.

JavaScriptatcoding
0 likes · 3 min read
Master JavaScript’s Array.at(): Simplify Access to Elements from Both Ends
21CTO
21CTO
Apr 16, 2022 · Frontend Development

Is Qt the Next UI Framework for Chromium? Inside Google’s New Code Review

Google has opened a Gerrit code review to evaluate Qt as a UI platform for Chromium, revealing early‑stage commits, a brief overview of Qt’s capabilities, and a comparison of the UI frameworks currently used across Chrome’s various operating systems.

BrowserChromiumQt
0 likes · 4 min read
Is Qt the Next UI Framework for Chromium? Inside Google’s New Code Review
JavaScript
JavaScript
Apr 15, 2022 · Frontend Development

How to Skip Elements in JavaScript Arrays Using flatMap

This article explains how JavaScript's map, filter, and especially flatMap methods can be used to transform arrays while selectively skipping or removing elements, offering concise code examples that demonstrate replacing separate map‑filter chains with a single flatMap call for cleaner, more efficient array processing.

ArrayMAPfilter
0 likes · 3 min read
How to Skip Elements in JavaScript Arrays Using flatMap
IT Services Circle
IT Services Circle
Apr 14, 2022 · Frontend Development

Getting Started with Alibaba's LowCodeEngine: A Low‑Code Platform for Building React Front‑End Applications

This article introduces Alibaba's open‑source LowCodeEngine, outlines its key features, and provides a step‑by‑step tutorial—including environment setup, dependency installation, project launch, component configuration, data source integration, preview, and code export—to help developers quickly build a low‑code front‑end platform using React.

LowCodeEngineNode.jsReact
0 likes · 6 min read
Getting Started with Alibaba's LowCodeEngine: A Low‑Code Platform for Building React Front‑End Applications
Alipay Experience Technology
Alipay Experience Technology
Apr 14, 2022 · Frontend Development

Boosting Complex Marketing Animations: WebGL Performance Tricks & AI‑Powered Smart Effects

This talk explains how Ant Group's MarsStudio tackles the challenges of large‑scale marketing scenes by optimizing WebGL rendering to reduce CPU‑GPU communication and by using machine‑learning‑driven smart animation generation to let front‑end developers create dynamic effects quickly and efficiently.

Graphicsfrontendmachine learning
0 likes · 9 min read
Boosting Complex Marketing Animations: WebGL Performance Tricks & AI‑Powered Smart Effects
Alibaba Terminal Technology
Alibaba Terminal Technology
Apr 13, 2022 · Frontend Development

Boost Front‑End Reliability with Real‑World RxJS Anti‑Corruption Layer Patterns

This article demonstrates how to use RxJS Observable to build robust front‑end anti‑corruption layers, covering stability improvement, splash‑screen timing, automatic fast‑API selection, race‑condition handling, and high‑order data composition with practical code examples and online demos.

Anti‑Corruption LayerData compositionRetry
0 likes · 12 min read
Boost Front‑End Reliability with Real‑World RxJS Anti‑Corruption Layer Patterns
政采云技术
政采云技术
Apr 12, 2022 · Artificial Intelligence

Design and Implementation of the Internal Intelligent QA Chatbot “Jarvis”

This article describes the end‑to‑end design, architecture, code implementation, and deployment steps for an internal intelligent QA chatbot named “Jarvis”, covering its V1.0 browser‑based prototype, V2.0 AI‑enhanced version, DingTalk integration, automation features, and future roadmap.

AIBackendChatbot
0 likes · 19 min read
Design and Implementation of the Internal Intelligent QA Chatbot “Jarvis”
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Apr 10, 2022 · Frontend Development

Master Front-End Layouts: From Centering to Multi-Column Designs

This article systematically explores front‑end page layout techniques, covering common layout types, their best‑practice implementations with CSS (including flex, grid, float, and positioning), detailed Less mixins for vertical, horizontal, and planar centering, and comprehensive solutions for two‑, three‑, and multi‑column layouts across desktop and mobile scenarios.

CSSCenteringFlexbox
0 likes · 25 min read
Master Front-End Layouts: From Centering to Multi-Column Designs
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Apr 8, 2022 · Frontend Development

Essential Front-End Tech Insights: SSR, Monitoring, Babel, CSS 2022 & More

This article collection explores key front‑end topics—including Vue server‑side rendering, comprehensive monitoring strategies, Babel compilation fundamentals, the latest CSS 2022 features, and decorator design patterns, and tile‑layout techniques for BI reporting—while also introducing the Cloud Classroom front‑end team.

CSSSSRbabel
0 likes · 4 min read
Essential Front-End Tech Insights: SSR, Monitoring, Babel, CSS 2022 & More
Baidu Geek Talk
Baidu Geek Talk
Apr 2, 2022 · Frontend Development

Frontend Development Case Studies: Resource Loading Debugging, z-index Management, and CSS Transform Effects on Fixed Positioning

This article walks through three frontend case studies: capturing and reporting resource‑load errors and slow assets with global listeners and performance APIs, centralizing z‑index handling to prevent stacking‑context chaos, and demonstrating how a CSS transform on an ancestor changes the behavior and layering of position:fixed elements.

CORSCSS transformdebugging
0 likes · 11 min read
Frontend Development Case Studies: Resource Loading Debugging, z-index Management, and CSS Transform Effects on Fixed Positioning
Alipay Experience Technology
Alipay Experience Technology
Apr 1, 2022 · Frontend Development

Mastering Interactive Features in AntV S2: Click Highlights, Hover, Brush, Resize and More

This article explains how AntV S2 implements a wide range of interactions—such as click and hover highlights, brush selection, dynamic row/column resizing, column hiding, link jumps and custom events—by using canvas rendering, event delegation, state management and JavaScript code examples.

AntV S2Canvas InteractionJavaScript
0 likes · 21 min read
Mastering Interactive Features in AntV S2: Click Highlights, Hover, Brush, Resize and More
ELab Team
ELab Team
Mar 31, 2022 · Frontend Development

How Babel Transforms Modern JavaScript: A Deep Dive into Frontend Compilation

This article explains the fundamentals of compilation, compares compiled and interpreted languages, outlines the full compiler pipeline, and uses Babel as a concrete example to show how JavaScript code is parsed, transformed, and generated for broader browser compatibility.

ASTCompilationJavaScript
0 likes · 27 min read
How Babel Transforms Modern JavaScript: A Deep Dive into Frontend Compilation
LOFTER Tech Team
LOFTER Tech Team
Mar 31, 2022 · Frontend Development

Understanding Browser Database IndexedDB and Using localForage

This article explains the architecture, features, and compatibility of IndexedDB, compares it with traditional storage options, introduces the localForage library for simplified asynchronous storage, and provides practical code examples for managing data and caching video content in web applications.

Browser DatabaseIndexedDBWeb Storage
0 likes · 10 min read
Understanding Browser Database IndexedDB and Using localForage