BestHub
Sign in
Tagged articles

ReAct

1114 articles · Page 6 of 12
政采云技术
政采云技术
May 24, 2023 · Frontend Development

LocatorJS Source Code Analysis: Architecture, Chrome Extension Integration, and Runtime Mechanics

This article provides a detailed walkthrough of LocatorJS, covering how to clone the repository, set up the development environment, explore the Chrome extension code, and dissect the runtime implementation that leverages React fiber, SolidJS components, and Babel plugins to enable precise code‑to‑UI mapping.

Babel PluginChrome ExtensionLocatorJS
0 likes · 11 min read
LocatorJS Source Code Analysis: Architecture, Chrome Extension Integration, and Runtime Mechanics
Alibaba Cloud Developer
Alibaba Cloud Developer
May 23, 2023 · Frontend Development

How to Refactor Complex React Pages with Component‑Based Design

This article explains how to tackle hard‑to‑maintain React pages by applying design patterns, splitting horizontal business logic into basic and block components, and using component composition to dramatically reduce code size while improving readability and maintainability.

Component RefactoringDesign PatternsFrontend Architecture
0 likes · 10 min read
How to Refactor Complex React Pages with Component‑Based Design
Full-Stack Trendsetter
Full-Stack Trendsetter
May 12, 2023 · Frontend Development

ChatGPT Compares React, Vue, and Angular: Pros, Cons, and Choosing the Right Framework

This article presents ChatGPT’s side‑by‑side analysis of React, Vue, and Angular, detailing each framework’s strengths—such as React’s component model, Vue’s low learning curve, and Angular’s full‑stack features—and weaknesses, then advises choosing based on project scale, complexity, and developer experience.

AngularFramework ComparisonFront-end frameworks
0 likes · 4 min read
ChatGPT Compares React, Vue, and Angular: Pros, Cons, and Choosing the Right Framework
360 Tech Engineering
360 Tech Engineering
May 9, 2023 · Frontend Development

Why Use AI to Write Unit Tests for React Hooks

This article explains the motivation for writing unit tests for shared React hook modules, demonstrates how an AI assistant in the Cursor IDE can generate Jest test cases from a repository, and details the step‑by‑step process of configuring the environment, fixing failing tests, and reflecting on AI's current limitations.

AIHooksJest
0 likes · 10 min read
Why Use AI to Write Unit Tests for React Hooks
Alipay Experience Technology
Alipay Experience Technology
Apr 25, 2023 · Frontend Development

How a 100‑Line React Chart Library Sparked a Decade of Open‑Source Leadership

This interview chronicles Wang Zhiwei’s journey from a university student experimenting with GitHub to the CTO of AntV, highlighting how his 100‑line Echarts‑for‑React component launched a thriving open‑source career, shaped Ant Group’s culture, and offers practical advice for developers eager to contribute to open source.

AntVEChartsReAct
0 likes · 10 min read
How a 100‑Line React Chart Library Sparked a Decade of Open‑Source Leadership
Huolala Tech
Huolala Tech
Apr 25, 2023 · Frontend Development

How to Solve Async Race Conditions and Caching in React with Custom Hooks

This article explains why React's synchronous component model struggles with async data fetching, demonstrates how to cancel stale requests, introduces a refetch‑only hook, and shows how to implement caching and deduplication to make queries pure functions, while recommending React Query and SWR for production use.

Custom HookReActasync
0 likes · 9 min read
How to Solve Async Race Conditions and Caching in React with Custom Hooks
Sohu Tech Products
Sohu Tech Products
Apr 12, 2023 · Frontend Development

Vue vs React: Programming Styles, View Syntax, Components, Routing, State Management, Reactivity and Lifecycle Comparison

This article provides a comprehensive technical comparison between Vue and React, covering their programming and view styles, component models, routing solutions, state‑management libraries, basic feature differences, reactivity mechanisms, lifecycle hooks and side‑effect handling, with illustrative code examples.

ComponentReActReactivity
0 likes · 15 min read
Vue vs React: Programming Styles, View Syntax, Components, Routing, State Management, Reactivity and Lifecycle Comparison
php Courses
php Courses
Apr 12, 2023 · Frontend Development

2023 Popular Front-End UI Frameworks: Overview and Comparison

This article explains what front‑end UI frameworks are, why they are useful, and presents a detailed list of the ten most popular domestic UI frameworks in 2023—including Element Plus, Ant Design, Naive UI, View UI Plus, Vant, LayUI, Bootstrap, and WeUI—while advising developers on how to choose the right one for their projects.

JavaScriptReActUI framework
0 likes · 6 min read
2023 Popular Front-End UI Frameworks: Overview and Comparison
Sohu Tech Products
Sohu Tech Products
Apr 6, 2023 · Frontend Development

Migrating Sentry’s Front‑end Tests from Enzyme to React Testing Library

At Sentry, the team documented a year‑and‑four‑month effort to replace Enzyme with React Testing Library across thousands of tests, detailing the motivations, migration strategy, performance challenges, tooling changes, and the eventual benefits such as improved accessibility, reduced reliance on React internals, and a more maintainable test suite.

EnzymeReActReact Testing Library
0 likes · 14 min read
Migrating Sentry’s Front‑end Tests from Enzyme to React Testing Library
Architects Research Society
Architects Research Society
Apr 1, 2023 · Frontend Development

Angular vs React vs Vue: Which Front‑End Framework Is Best in 2021?

This article analyzes the popularity, download trends, developer preferences, and strengths and weaknesses of Angular, React, and Vue using StackOverflow surveys, NPM download statistics, and State‑of‑JavaScript reports, concluding that React leads in 2021 with Vue and Angular following behind.

AngularFramework ComparisonFront-end
0 likes · 11 min read
Angular vs React vs Vue: Which Front‑End Framework Is Best in 2021?
KooFE Frontend Team
KooFE Frontend Team
Mar 28, 2023 · Frontend Development

Master React Refs: From DOM Access to Imperative APIs

Learn how to use React refs—including useRef, forwardRef, and useImperativeHandle—to access DOM elements, create custom imperative APIs, and build interactive forms with focus and shake effects, while understanding best practices for when to employ refs versus state or props.

ReActforwardReffrontend
0 likes · 14 min read
Master React Refs: From DOM Access to Imperative APIs
Huolala Tech
Huolala Tech
Mar 28, 2023 · Frontend Development

How to Optimize React Context to Prevent Unnecessary Re‑renders

Learn how to effectively use React Context for state management, avoid props drilling, and eliminate redundant re‑renders by implementing a custom publish‑subscribe store, selector hooks, and performance optimizations similar to libraries like zustand.

Performance OptimizationPublish-SubscribeReAct
0 likes · 11 min read
How to Optimize React Context to Prevent Unnecessary Re‑renders
KooFE Frontend Team
KooFE Frontend Team
Mar 23, 2023 · Frontend Development

Why useSyncExternalStore Is Essential for Safe State Sync in React 18

This article explains the purpose, benefits, and implementation of React 18’s useSyncExternalStore hook, covering its role in synchronizing external state such as browser APIs, preventing UI tearing during concurrent rendering, and providing SSR support with practical code examples like useMediaQuery and useWindowSize.

ReActSSRuseSyncExternalStore
0 likes · 13 min read
Why useSyncExternalStore Is Essential for Safe State Sync in React 18
ByteFE
ByteFE
Mar 20, 2023 · Frontend Development

Understanding the Proposed React “use” Hook: Design, Usage, and Limitations

This article explains the new React "use" hook proposal, covering its background, how to integrate it with Suspense, minimal examples, promise caching, control‑flow usage, design motivations, implementation details, limitations, and the surrounding community debate.

HooksJavaScriptPromise
0 likes · 12 min read
Understanding the Proposed React “use” Hook: Design, Usage, and Limitations
HomeTech
HomeTech
Mar 1, 2023 · Backend Development

Overview of the Wenjie Low-Code Platform: Architecture, Technologies, and Use Cases

The article presents a comprehensive overview of the Wenjie low-code platform, detailing its motivation, front‑end React framework, back‑end Spring Cloud micro‑services architecture, PowerJob scheduler, custom ORM, various data‑modeling and data‑processing scenarios, dashboard visualizations, monitoring and alerting features, as well as future plans and a concluding summary.

Data IntegrationPlatformPowerJob
0 likes · 11 min read
Overview of the Wenjie Low-Code Platform: Architecture, Technologies, and Use Cases
21CTO
21CTO
Feb 21, 2023 · Frontend Development

Why JavaScript, AI, and Web3 Still Dominate 2023: Key Trends

The 2023 tech landscape shows JavaScript retaining its top spot, AI tools like Copilot and ChatGPT reshaping development productivity, and Web3 technologies maintaining strong growth, while frontend frameworks such as React, Vue, and Svelte compete for market demand and developer satisfaction.

AIJavaScriptReAct
0 likes · 10 min read
Why JavaScript, AI, and Web3 Still Dominate 2023: Key Trends
Goodme Frontend Team
Goodme Frontend Team
Feb 20, 2023 · Frontend Development

Top 5 Must‑Read Frontend & AI Articles of the Week

This weekly digest curates five essential reads—including Vue.js 2023 roadmap insights, a deep dive into React Hooks, standout ChatGPT open‑source projects, practical front‑end quality measures, and a critical look at React's evolution—offering developers fresh perspectives and actionable knowledge.

AIReActVue.js
0 likes · 3 min read
Top 5 Must‑Read Frontend & AI Articles of the Week
Goodme Frontend Team
Goodme Frontend Team
Feb 18, 2023 · Frontend Development

How to Build a Reactive System in JavaScript: From Object.defineProperty to Proxy

This article walks through creating a JavaScript reactive system for front‑end development, covering the classic Object.defineProperty approach, dependency tracking, Proxy‑based deep reactivity, integration with React hooks, performance tweaks, and advanced considerations such as async queues and compile‑time helpers.

Object.definePropertyReActproxy
0 likes · 17 min read
How to Build a Reactive System in JavaScript: From Object.defineProperty to Proxy
Sohu Tech Products
Sohu Tech Products
Feb 15, 2023 · Frontend Development

From Zero to One: Building a React CLI Scaffolding Tool Based on Vue CLI Insights

This article documents the complete process of researching, analyzing, and developing a custom React CLI scaffolding tool, including a detailed examination of Vue CLI's architecture, plugin mechanism, and codebase, as well as the implementation of interactive command‑line features, configuration options, and publishing steps.

CLIMonorepoNode.js
0 likes · 26 min read
From Zero to One: Building a React CLI Scaffolding Tool Based on Vue CLI Insights
Huolala Tech
Huolala Tech
Feb 14, 2023 · Frontend Development

When Does a React Component Re‑Render and How to Optimize It?

This article explains what triggers a React component re‑render, distinguishes required from unnecessary renders, and presents practical techniques—such as narrowing render scope, using memo, useMemo, useCallback, and context selectors—to improve performance in complex applications.

HooksOptimizationPerformance
0 likes · 11 min read
When Does a React Component Re‑Render and How to Optimize It?
Xianyu Technology
Xianyu Technology
Feb 14, 2023 · Frontend Development

How FishUI Achieves Seamless Cross‑Platform UI Development for Xianyu

FishUI is a cross‑platform React component library designed for Xianyu’s kun and web containers, offering unified APIs, automated environment detection, monorepo architecture with pnpm, lerna + nx versioning, custom build loaders, comprehensive testing, and documentation tooling to boost developer efficiency and maintainability.

Build OptimizationMonorepoReAct
0 likes · 15 min read
How FishUI Achieves Seamless Cross‑Platform UI Development for Xianyu
Alipay Experience Technology
Alipay Experience Technology
Feb 14, 2023 · Frontend Development

Mastering Dynamic Themes in Ant Design V5: From Global Algorithms to Local Customizations

Ant Design V5’s CSS‑in‑JS architecture enables powerful dynamic theming, allowing developers and designers to implement global theme algorithms, partial theme overrides, component‑level styling, and seamless multi‑theme compositions, illustrated with real‑world applications, code snippets, and visual comparisons across light and dark modes.

CSS-in-JSDynamic ThemingReAct
0 likes · 13 min read
Mastering Dynamic Themes in Ant Design V5: From Global Algorithms to Local Customizations
HelloTech
HelloTech
Feb 13, 2023 · Mobile Development

Hybrid Native Map and H5 Integration via WebView for Overseas Projects

The project replaces costly Google Dynamic Maps with a hybrid solution that overlays a transparent WebView on a native map component, using a JSBridge to route H5 events and native map interactions, dynamically managing hot‑zone data, thereby cutting service fees, boosting performance, and preserving H5 development flexibility.

HotzoneHybrid AppJSBridge
0 likes · 10 min read
Hybrid Native Map and H5 Integration via WebView for Overseas Projects
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Feb 13, 2023 · Frontend Development

Advanced Tips and Common Pitfalls for React Hooks (useState, useEffect, useContext, useReducer, etc.)

This article provides in‑depth guidance on using React hooks such as useState, useEffect, useContext, useReducer, and related utilities, covering lazy initialization, functional updates, performance‑optimising patterns, state sharing strategies, and advanced techniques like useImmer and react‑tracked to reduce mental overhead and avoid bugs.

HooksPerformanceReAct
0 likes · 16 min read
Advanced Tips and Common Pitfalls for React Hooks (useState, useEffect, useContext, useReducer, etc.)
ByteFE
ByteFE
Feb 8, 2023 · Frontend Development

React Context Re‑render Issues and an Optimized use‑context‑selector Implementation

This article explains why passing an object as a React Context Provider value can cause unnecessary re‑renders, introduces the community‑made use‑context‑selector library to mitigate the problem, analyzes its limitations, and presents a custom optimized implementation using useSyncExternalStore for precise component updates.

HooksPerformanceReAct
0 likes · 17 min read
React Context Re‑render Issues and an Optimized use‑context‑selector Implementation
KooFE Frontend Team
KooFE Frontend Team
Jan 28, 2023 · Frontend Development

Redesigning Excalidraw’s Component API: From Render Props to Child Components

The article explains how Excalidraw’s new component API replaces render props with a child‑component approach, introduces customizable MainMenu, Footer, and WelcomeScreen components, provides code examples, and discusses the benefits and limitations of this redesign for developers building custom whiteboard applications.

ExcalidrawReActUI customization
0 likes · 10 min read
Redesigning Excalidraw’s Component API: From Render Props to Child Components
Alibaba Cloud Developer
Alibaba Cloud Developer
Jan 9, 2023 · Frontend Development

Mastering React Design Patterns: From Containers to Custom Hooks

This article reviews essential React design patterns—including container/presentational components, higher‑order components, render props, compound components, and custom hooks—explaining the underlying SOLID principles, providing clear code examples, and offering guidance on when to apply each pattern.

Component ArchitectureDesign PatternsHigher-Order Components
0 likes · 10 min read
Mastering React Design Patterns: From Containers to Custom Hooks
Xianyu Technology
Xianyu Technology
Jan 3, 2023 · Frontend Development

Using XState for Collaborative Frontend Development and State Management

By adopting the XState state‑machine library, the team transformed a complex, interactive page’s development from costly component‑wise coordination into a collaborative workflow where a small core group maintains a visual state graph while UI developers work on lightweight components, improving performance and reducing render overhead.

ReActState ManagementXState
0 likes · 12 min read
Using XState for Collaborative Frontend Development and State Management
Laravel Tech Community
Laravel Tech Community
Dec 25, 2022 · Frontend Development

Next.js 13.1 Release Highlights and New Features

Next.js 13.1 has been officially released, introducing improvements to the app directory, built‑in module transpilation, a stable Edge runtime, Turbopack enhancements, middleware capabilities, a new SWC transform called modularizeImports, and various memory and template optimizations.

Edge RuntimeNext.jsReAct
0 likes · 2 min read
Next.js 13.1 Release Highlights and New Features
ByteFE
ByteFE
Dec 25, 2022 · Frontend Development

Curated Technical Articles on Frontend Development, Low‑Code Collaboration, Browser Caching, and More

This collection presents curated technical articles covering low‑code multi‑branch collaborative development, comprehensive front‑end state management, hands‑on browser cache exploration, intranet penetration principles, advanced CSS Houdini techniques, front‑end mock data strategies, React ref fundamentals, and performance‑focused foreign reads.

Browser CacheCSS HoudiniReAct
0 likes · 6 min read
Curated Technical Articles on Frontend Development, Low‑Code Collaboration, Browser Caching, and More
DaTaobao Tech
DaTaobao Tech
Dec 19, 2022 · Frontend Development

How ice.js 3 Redefines Frontend Performance with Parallel Loading and SSR Innovations

ice.js 3 merges MPA and SPA concepts to deliver per‑page HTML, parallelizes block and data loading, introduces SSG and out‑of‑the‑box SSR with streaming and Server Components, supports multi‑end development, and upgrades the runtime with swc and esbuild to dramatically improve web performance and developer experience.

Frontend PerformanceReActSSR
0 likes · 17 min read
How ice.js 3 Redefines Frontend Performance with Parallel Loading and SSR Innovations
DaTaobao Tech
DaTaobao Tech
Dec 19, 2022 · Frontend Development

ice.js 3 Framework Overview and New Features

Ice.js 3, Alibaba’s Taobao‑originated multi‑terminal framework, extends earlier versions to unify PC, web, and mini‑program development with a React 18‑based runtime, smaller bundles, built‑in plugins, SWC/esbuild toolchains, SSR/SSG data loading, Midway FaaS deployment, and a roadmap toward React Streaming and Server Components.

Build ToolsReActSSR
0 likes · 10 min read
ice.js 3 Framework Overview and New Features
ByteDance Web Infra
ByteDance Web Infra
Dec 16, 2022 · Frontend Development

Understanding React 18 Streaming SSR and Selective Hydration

React 18 introduces Streaming SSR, allowing the server to send HTML in chunks and perform selective hydration, which improves performance by rendering ready sections early and handling asynchronous components via Suspense, with detailed examples of code implementation, error handling, and JS/CSS integration.

Code SplittingReActSelective Hydration
0 likes · 25 min read
Understanding React 18 Streaming SSR and Selective Hydration
Alipay Experience Technology
Alipay Experience Technology
Dec 16, 2022 · Frontend Development

Unlocking Progressive State Management with Zustand – Is There a Silver Bullet?

This article walks through using the Zustand state‑management library in a complex React component, covering store initialization, actions, selectors, modular file structure, handling controlled vs uncontrolled modes, performance optimizations, and devtools integration, while sharing practical tips and code examples for scalable frontend development.

Controlled ComponentsReActState Management
0 likes · 30 min read
Unlocking Progressive State Management with Zustand – Is There a Silver Bullet?
KooFE Frontend Team
KooFE Frontend Team
Dec 15, 2022 · Frontend Development

How to Avoid Common React useState Mistakes and Write Cleaner Code

This article explains frequent misuse patterns of React's useState hook—redundant, duplicate, contradictory, and over‑reliance on useEffect—showing why they hurt readability and maintenance, and provides concise refactor solutions using derived state, IDs, and useReducer.

JavaScriptReActuseState
0 likes · 14 min read
How to Avoid Common React useState Mistakes and Write Cleaner Code
Alipay Experience Technology
Alipay Experience Technology
Dec 15, 2022 · Frontend Development

Why Zustand Is the Best Choice for Complex Frontend State Management

This article examines the pitfalls of traditional React state management in complex applications, explains why Zustand offers superior state sharing, mutation, derivation, and performance optimization, and provides detailed code examples and best practices for integrating Zustand into large-scale frontend projects.

HooksReActState Management
0 likes · 26 min read
Why Zustand Is the Best Choice for Complex Frontend State Management
HomeTech
HomeTech
Dec 13, 2022 · Frontend Development

Choosing uni-app over taro for Cross‑Platform Mini‑Program Development: Background, Technical Selection, and Case Study

This article analyzes the rapid growth of mobile mini‑programs, compares the cross‑platform frameworks uni‑app and taro based on core requirements, ecosystem, and performance, presents a concrete project structure and rendering details, and quantifies the efficiency gains achieved by adopting uni‑app for automotive quotation services.

Mini ProgramReActTaRO
0 likes · 9 min read
Choosing uni-app over taro for Cross‑Platform Mini‑Program Development: Background, Technical Selection, and Case Study
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 24, 2022 · Frontend Development

Debugging React Source Code with Webpack Alias and Custom CRA Configuration

This guide walks through creating a React app, downloading the React source, building it, linking the packages, configuring webpack aliases, fixing import paths, disabling ESLint, adjusting environment variables, and resolving internal React errors so you can edit and debug the original React source directly in the browser.

DebuggingReActcreate-react-app
0 likes · 11 min read
Debugging React Source Code with Webpack Alias and Custom CRA Configuration
Huolala Tech
Huolala Tech
Nov 23, 2022 · Frontend Development

Sync React Component State Without Heavy Libraries: Custom Hook & Pub‑Sub

This article explains how to synchronize state across distant React components without relying on heavy libraries, using a custom hook and a publish‑subscribe model, and discusses optimizations such as avoiding redundant updates and incorporating a simple reducer for efficient change detection.

Custom HookReActRedux
0 likes · 7 min read
Sync React Component State Without Heavy Libraries: Custom Hook & Pub‑Sub
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 22, 2022 · Frontend Development

React Scheduler: Implementing Idle‑Time Execution and Time Slicing with requestAnimationFrame, postMessage and MessageChannel

This article explains how React simulates requestIdleCallback by combining requestAnimationFrame, postMessage, and MessageChannel to execute work during browser idle periods, detailing the evolution from the early rAF‑postMessage approach in v16 to the message‑loop implementation in v18 and providing simplified source code examples.

MessageChannelReActTime Slicing
0 likes · 14 min read
React Scheduler: Implementing Idle‑Time Execution and Time Slicing with requestAnimationFrame, postMessage and MessageChannel
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 22, 2022 · Frontend Development

Building a Management Backend with Ant Design 5, React 18, Vite, and TypeScript

This article explains why Ant Design 5 is preferred over MUI, then walks through configuring Vite and tsconfig, creating login and home pages, designing a recursive routing system, implementing lazy loading, menu generation, route listening hooks, tab management with KeepAlive, theme customization, and dynamic routing with React Router 6.4.3 for a full‑featured admin dashboard.

MobXReActRouting
0 likes · 17 min read
Building a Management Backend with Ant Design 5, React 18, Vite, and TypeScript
Ctrip Technology
Ctrip Technology
Nov 21, 2022 · Frontend Development

Design and Implementation of Ctrip's New Homepage: Island Architecture, Component Development, and Data Configuration System

The article presents a comprehensive case study of Ctrip's 2022 PC homepage redesign, detailing the motivations, requirement analysis, island‑style architecture, cross‑team component development, server‑side rendering, public component challenges, and the dynamic data‑configuration platform that together enable fast, maintainable, and scalable web delivery.

Component ArchitectureIsland ArchitectureNode.js
0 likes · 22 min read
Design and Implementation of Ctrip's New Homepage: Island Architecture, Component Development, and Data Configuration System
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 17, 2022 · Frontend Development

My Journey Learning Frontend: Vue, React, Component Libraries, and Full‑Stack Integration

The article shares a developer's practical experience of transitioning from backend to frontend by learning Vue and React, exploring component libraries, tackling layout and styling challenges, and integrating the frontend build into a backend Maven project for a complete gateway console.

Component librariesFull-StackMaven
0 likes · 15 min read
My Journey Learning Frontend: Vue, React, Component Libraries, and Full‑Stack Integration
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 17, 2022 · Frontend Development

Deep Dive into requestIdleCallback API and Its Use with React

This article explains the requestIdleCallback web API, its syntax, execution timing, task‑queue handling, performance characteristics, compatibility issues, and practical integration with React and requestAnimationFrame to off‑load low‑priority work without blocking UI rendering.

Idle TasksJavaScriptPerformance
0 likes · 14 min read
Deep Dive into requestIdleCallback API and Its Use with React
ByteFE
ByteFE
Nov 16, 2022 · Frontend Development

React17 Event Mechanism Deep Dive: Propagation, Binding, and Delegation

This article explains React17's event mechanism changes compared to React16, covering event propagation phases, binding methods like inline HTML, DOM0, and addEventListener, event delegation for efficient handling, and browser event differences.

Event PropagationReActReact17
0 likes · 24 min read
React17 Event Mechanism Deep Dive: Propagation, Binding, and Delegation
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 15, 2022 · Frontend Development

Understanding requestAnimationFrame: Usage, Timing, Performance, and Compatibility

This article explains the requestAnimationFrame API, demonstrates basic and cancelable animation examples, discusses its execution timing within the browser frame lifecycle, compares its performance to setTimeout, covers compatibility and polyfills, and shows how to wrap it in a React hook for practical use.

BrowserJavaScriptPolyfill
0 likes · 11 min read
Understanding requestAnimationFrame: Usage, Timing, Performance, and Compatibility
GuanYuan Data Tech Team
GuanYuan Data Tech Team
Nov 10, 2022 · Frontend Development

How to Build Plugin‑Based Custom Charts with Web Components in a React Data Platform

This article explains why a data‑analysis platform needs a plugin architecture for custom charts, compares iframe‑based and Web Components approaches, shows how to implement a lightweight ECharts‑based chart plugin, and provides step‑by‑step code samples and technical selection criteria for frontend developers.

Custom ChartsEChartsJavaScript
0 likes · 17 min read
How to Build Plugin‑Based Custom Charts with Web Components in a React Data Platform
ByteFE
ByteFE
Nov 4, 2022 · Frontend Development

Turbopack vs Vite: A Comparative Analysis of Performance

The article examines Turbopack's claimed performance advantages over Vite, critiques marketing-driven comparisons in open-source tools, and emphasizes the need for transparent, peer-reviewed evaluations in frontend development.

CSS GridDockerPerformance Optimization
0 likes · 4 min read
Turbopack vs Vite: A Comparative Analysis of Performance
Programmer DD
Programmer DD
Nov 2, 2022 · Frontend Development

React vs Vue: Which Frontend Framework Should You Choose?

This comprehensive guide examines the key factors for selecting between React and Vue—including team suitability, compatibility, usage patterns, ecosystem, cross‑platform support, performance benchmarks, mental models, community size, and licensing—to help developers make an informed technology‑stack decision.

Framework ComparisonReActVue
0 likes · 25 min read
React vs Vue: Which Frontend Framework Should You Choose?
KooFE Frontend Team
KooFE Frontend Team
Oct 31, 2022 · Frontend Development

How React’s New ‘use’ Hook Simplifies Promise Handling in Server and Client Components

React’s newly proposed use hook lets developers consume promises directly in client components and conditionally in loops or blocks, while server components continue to use async/await, offering a unified yet flexible data‑fetching primitive that integrates seamlessly with the JavaScript ecosystem.

Async/AwaitClient ComponentsPromise
0 likes · 11 min read
How React’s New ‘use’ Hook Simplifies Promise Handling in Server and Client Components
Architecture Digest
Architecture Digest
Oct 29, 2022 · Frontend Development

Design and Implementation of a General‑Purpose Data Visualization Big‑Screen Platform

This article presents the overall design, technology selection, architecture, and core implementation details—including adaptive layout, component development workflow, drag‑and‑drop handling, and state push mechanisms—of a low‑code, reusable big‑screen data visualization platform built with React and modern front‑end visualization libraries.

Big ScreenReActdata visualization
0 likes · 15 min read
Design and Implementation of a General‑Purpose Data Visualization Big‑Screen Platform
Baidu Intelligent Cloud Tech Hub
Baidu Intelligent Cloud Tech Hub
Oct 28, 2022 · Frontend Development

Designing Flexible Low‑Code Component Systems: Insights from Baidu’s AI‑SuDa Platform

This article explains how Baidu AI Cloud's low‑code platform AI‑SuDa builds a flexible component system, covering the transition from UI libraries to declarative low‑code components, detailed React examples, visual editor configuration, component registration, data binding, and event‑action mechanisms for efficient application development.

ReActVisual Editoramis
0 likes · 21 min read
Designing Flexible Low‑Code Component Systems: Insights from Baidu’s AI‑SuDa Platform
JD Retail Technology
JD Retail Technology
Oct 21, 2022 · Frontend Development

Design and Implementation of a One‑Code‑Multi‑End Interactive Development Engine Using Taro and React

This article describes how a one‑code‑multi‑end interactive engine was built by selecting the Taro framework, adapting H5 design, creating a unified data‑management layer, defining a generic development model, handling UI adaptation, animation, and engineering concerns to improve development efficiency across web, mini‑program and app platforms.

Engine ArchitectureReActState Management
0 likes · 17 min read
Design and Implementation of a One‑Code‑Multi‑End Interactive Development Engine Using Taro and React
Bilibili Tech
Bilibili Tech
Oct 18, 2022 · Frontend Development

Building a Slate.js Rich Text Editor: Toolbar, Lists, and Image Upload

This tutorial walks through the practical steps of extending a Slate.js rich‑text editor with toolbar actions, multi‑level list handling, and a robust image‑upload solution, providing code snippets, implementation details, and design considerations for each feature.

Image UploadJavaScriptReAct
0 likes · 12 min read
Building a Slate.js Rich Text Editor: Toolbar, Lists, and Image Upload
KooFE Frontend Team
KooFE Frontend Team
Oct 16, 2022 · Frontend Development

How to Optimize Data Fetching in React for Better Performance

Learn how to optimize data fetching in React by understanding initial vs on‑demand requests, avoiding waterfall patterns, leveraging Promise.all, parallel promises, data providers, and browser limits, while applying best practices for useEffect, lifecycle handling, and performance‑focused component design.

Data FetchingPromise.allReAct
0 likes · 26 min read
How to Optimize Data Fetching in React for Better Performance
DeWu Technology
DeWu Technology
Oct 14, 2022 · Frontend Development

Micro‑Frontend Architecture with Qiankun: Practical Implementation and Migration Strategies

The article outlines how an enterprise back‑office monolith can be progressively migrated to a Qiankun‑based micro‑frontend architecture—allowing independent Vue, React, Angular or legacy apps, shared SDKs, route isolation, keep‑alive state, and sandboxed styling—resulting in over 90 % legacy integration, a unified React stack for new features, and significantly improved development efficiency and ROI.

Frontend ArchitectureReActUMI
0 likes · 15 min read
Micro‑Frontend Architecture with Qiankun: Practical Implementation and Migration Strategies
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 14, 2022 · Frontend Development

Why Sub‑Application Routes Do Not Update When the Main Application Switches Routes in Qiankun and How to Fix It

This article explains the issue where a Qiankun micro‑frontend main app changes its route but the child app's route does not update, analyzes the underlying cause related to hashchange events, and provides two practical solutions: manually dispatching a hashchange event or replacing Link tags with anchor tags.

HashChangeJavaScriptMicro‑frontend
0 likes · 12 min read
Why Sub‑Application Routes Do Not Update When the Main Application Switches Routes in Qiankun and How to Fix It
vivo Internet Technology
vivo Internet Technology
Oct 13, 2022 · Frontend Development

Design and Implementation of a General‑Purpose Data Visualization Big‑Screen Platform

The paper presents a low‑code, schema‑driven big‑screen visualization platform built with React, ECharts, D3 and related libraries, detailing its four‑module architecture, adaptive layout techniques, reusable component workflow, drag‑and‑drop enhancements, and WebSocket‑based state management, and outlines future extensions such as a component marketplace and 3D rendering.

Big ScreenDashboardReAct
0 likes · 15 min read
Design and Implementation of a General‑Purpose Data Visualization Big‑Screen Platform
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 13, 2022 · Frontend Development

Why React Excels in Cross‑Platform Dynamic Development: Core Advantages and Implementation Details

The article explains why React is well‑suited for cross‑platform dynamic development, detailing its data‑driven model, JSX‑to‑virtual‑DOM workflow, fiber architecture, Taro reconciler adaptations, and independent event system, and shows how React can serve as both a DSL and a full runtime for mobile and web.

FiberJSXReAct
0 likes · 12 min read
Why React Excels in Cross‑Platform Dynamic Development: Core Advantages and Implementation Details
JD Retail Technology
JD Retail Technology
Oct 12, 2022 · Frontend Development

Micro‑Frontend Architecture for H5 E‑Commerce: Design, Implementation, and Progressive Upgrade

This article presents a comprehensive micro‑frontend solution for H5 e‑commerce sites, covering background analysis, problem identification, architectural design with BFF layer, code examples for registration, routing, and progressive migration, and concludes with the benefits of modular, SEO‑friendly front‑end development.

BFFFrontend ArchitectureReAct
0 likes · 20 min read
Micro‑Frontend Architecture for H5 E‑Commerce: Design, Implementation, and Progressive Upgrade
NetEase Smart Enterprise Tech+
NetEase Smart Enterprise Tech+
Oct 12, 2022 · Frontend Development

Designing a Scalable Multilingual Component for Modern Frontend Apps

This article explains how NetEase Qiyu built a high‑cohesion multilingual component using React context and hooks, transformed tree‑structured language data for component libraries, and created a VSCode plugin to automate i18n key replacement, enabling efficient multi‑language support for their customer‑service console.

ReActVSCode plugincomponent library
0 likes · 14 min read
Designing a Scalable Multilingual Component for Modern Frontend Apps
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 11, 2022 · Frontend Development

Testing React Hooks with Jest and React Testing Library

This article provides a comprehensive guide on unit testing custom React Hooks using Jest, renderHook, act, and the React Testing Library, covering examples such as useCounter, useEventListener, useHover, and useMouse with detailed code snippets and best‑practice recommendations.

HooksJavaScriptJest
0 likes · 16 min read
Testing React Hooks with Jest and React Testing Library
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 11, 2022 · Frontend Development

Why React Excels in Cross‑Platform Dynamic Development: Core Advantages and Implementation Details

The article explains how React’s data‑driven model, JSX‑to‑virtual‑DOM workflow, fiber architecture, independent event system, and adaptations in frameworks like React Native and Taro enable efficient cross‑platform dynamic applications, while comparing it with traditional template‑based approaches.

FiberJSXReAct
0 likes · 13 min read
Why React Excels in Cross‑Platform Dynamic Development: Core Advantages and Implementation Details
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Oct 11, 2022 · Frontend Development

Mastering Recoil: Advanced State Management Techniques for React

This article provides a comprehensive guide to Recoil, Facebook's React state‑management library, covering its graph‑based architecture, atoms and selectors, family APIs for bulk state, async data handling with Suspense and Loadable, snapshot usage for SSR and time‑travel, external synchronization, and practical tips for reducing mental load.

HooksReActRecoil
0 likes · 14 min read
Mastering Recoil: Advanced State Management Techniques for React
DaTaobao Tech
DaTaobao Tech
Sep 29, 2022 · Frontend Development

Understanding the Implementation of CSS-in-JS with Styled-Components

The article explains CSS‑in‑JS fundamentals, examines styled‑components’ source code—including its styled function, createStyledComponent factory, and runtime style injection—compares it with emotion, demonstrates a simple SolidJS MVP implementation, and discusses the technique’s rise, limitations, and possible compile‑time or atomic‑CSS future.

CSS-in-JSImplementationReAct
0 likes · 11 min read
Understanding the Implementation of CSS-in-JS with Styled-Components
Sohu Tech Products
Sohu Tech Products
Sep 21, 2022 · Frontend Development

The New Wave of React State Management

This article examines the core challenges that global state‑management libraries must address in modern React applications, reviews the evolution from early solutions like Redux to newer atom‑based and remote‑state tools, and offers guidance on selecting the most suitable library for a given project.

HooksJotaiReAct
0 likes · 17 min read
The New Wave of React State Management
KooFE Frontend Team
KooFE Frontend Team
Sep 18, 2022 · Frontend Development

PureComponent vs Hooks: Mastering React Re‑renders and Performance

This article explores how PureComponent and shouldComponentUpdate address unnecessary re‑renders in class components, compares them with functional components and hooks, and provides practical techniques—including React.memo, useCallback, setState updater functions, and refs—to optimize rendering performance in modern React applications.

HooksPerformancePureComponent
0 likes · 20 min read
PureComponent vs Hooks: Mastering React Re‑renders and Performance
Bilibili Tech
Bilibili Tech
Sep 16, 2022 · Frontend Development

Understanding contenteditable and Modern Rich Text Editors with Slate.js

The article explains how the HTML contenteditable attribute enables in‑place editing, why legacy execCommand‑based editors are inconsistent, and how modern frameworks such as Slate.js—built on React and Immutable.js—provide a structured, location‑based data model with Transform and Node APIs for reliable, portable rich‑text editing.

JavaScriptReActSlate.js
0 likes · 12 min read
Understanding contenteditable and Modern Rich Text Editors with Slate.js
ELab Team
ELab Team
Sep 14, 2022 · Frontend Development

Master Browser Extension Development with Plasmo: From Basics to Advanced Practices

This comprehensive guide explores the fundamentals and advanced techniques of building Chrome extensions using the Plasmo framework, covering plugin concepts, traditional and modern development workflows, code examples, dynamic UI injection, resource handling, and best practices for efficient, scalable extension engineering.

Browser extensionChrome APIPlasmo
0 likes · 39 min read
Master Browser Extension Development with Plasmo: From Basics to Advanced Practices
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Sep 9, 2022 · Frontend Development

Uncover 6 Weird React Behaviors and Fresh Frontend Trends

This curated overview highlights six puzzling React phenomena, introduces CSS Grid basics, examines AI‑generated art controversies, discusses COEP’s security benefits, reviews the new Fresh full‑stack framework, and explores how to measure user experience with data‑driven metrics.

AI artCSS GridReAct
0 likes · 4 min read
Uncover 6 Weird React Behaviors and Fresh Frontend Trends
IT Services Circle
IT Services Circle
Sep 6, 2022 · Frontend Development

Understanding Low‑Code: Tools vs. Platforms and Their Impact on Development

The article examines the recurring hype around low‑code, contrasting the programmer’s view of it as a DSL like JSX that abstracts DOM manipulation with the capital‑driven notion of a platform that replaces developers, and discusses the practical challenges of customization, collaboration, testing, and the future of low‑code tools.

DevelopmentPlatformReAct
0 likes · 7 min read
Understanding Low‑Code: Tools vs. Platforms and Their Impact on Development
Alibaba Cloud Developer
Alibaba Cloud Developer
Sep 2, 2022 · Frontend Development

How to Build a Standardized Webpack + React + TypeScript Front‑End from Scratch

This tutorial walks you through creating a production‑ready front‑end project from an empty directory using Webpack 5, React 18 and TypeScript, covering project structure, dependencies, Babel and TypeScript setup, resource handling, development environment, performance optimizations, and full configuration files.

BabelConfigurationESLint
0 likes · 26 min read
How to Build a Standardized Webpack + React + TypeScript Front‑End from Scratch