BestHub
Sign in
Tagged articles

frontend

3211 articles · Page 6 of 33
JavaScript
JavaScript
Jan 3, 2025 · Frontend Development

8 Proven Techniques to Supercharge Mobile Touch Event Performance

Discover eight practical strategies—including passive listeners, event delegation, scroll-through prevention, requestAnimationFrame, throttling, hardware acceleration, click-delay elimination, custom gestures, and IntersectionObserver—that dramatically boost mobile touch event responsiveness and deliver silky-smooth user experiences across web applications.

PerformanceTouch Eventsfrontend
0 likes · 5 min read
8 Proven Techniques to Supercharge Mobile Touch Event Performance
JavaScript
JavaScript
Jan 2, 2025 · Frontend Development

7 Practical Arrow Function Patterns to Master ‘this’ in JavaScript

This article explores seven common scenarios where JavaScript arrow functions elegantly resolve the notorious ‘this’ binding issues—ranging from object methods and event callbacks to constructors, prototype methods, array callbacks, timers, and dynamic contexts—helping developers write cleaner, more maintainable code.

Arrow FunctionsJavaScriptes6
0 likes · 7 min read
7 Practical Arrow Function Patterns to Master ‘this’ in JavaScript
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jan 2, 2025 · Frontend Development

Understanding VueUse's createGlobalState and effectScope: A Comparison with Simple Closure Implementation

This article explains how VueUse's createGlobalState leverages Vue's effectScope to provide global state sharing across components, compares it with a straightforward closure approach, and discusses the practical implications of using effectScope for dependency collection and cleanup in frontend development.

VuecreateGlobalStateeffectScope
0 likes · 8 min read
Understanding VueUse's createGlobalState and effectScope: A Comparison with Simple Closure Implementation
JavaScript
JavaScript
Dec 31, 2024 · Frontend Development

Detect and Fix Common JavaScript Memory Leaks in Front‑End Development

This guide explains what JavaScript memory leaks are, illustrates typical front‑end leak scenarios such as forgotten timers, detached DOM references, improper closures, global variables, open WebSockets, misuse of Map/Set, and console logs, and provides practical solutions to prevent and resolve each issue.

DebuggingGarbage CollectionJavaScript
0 likes · 7 min read
Detect and Fix Common JavaScript Memory Leaks in Front‑End Development
JavaScript
JavaScript
Dec 30, 2024 · Frontend Development

Master JavaScript’s ‘this’: 4 Binding Rules, Arrow Functions & Best Practices

This article demystifies JavaScript’s notoriously tricky ‘this’ keyword by explaining its four binding rules—default, implicit, explicit, and new—showing practical code examples, illustrating how arrow functions inherit lexical this, and offering best‑practice tips to avoid common pitfalls in modern front‑end development.

BindingJavaScriptarrow function
0 likes · 7 min read
Master JavaScript’s ‘this’: 4 Binding Rules, Arrow Functions & Best Practices
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 30, 2024 · Frontend Development

Wujie Micro Frontend Implementation Guide

This article details a practical implementation of the Wujie micro‑frontend framework across three Vue‑based management systems, covering preparation of the host app, login state handling, layout selection, event bus integration, network request management, UI adjustments, and shared state synchronization, with code snippets and lessons learned.

Wujieevent busfrontend
0 likes · 20 min read
Wujie Micro Frontend Implementation Guide
Goodme Frontend Team
Goodme Frontend Team
Dec 30, 2024 · Frontend Development

Why Huge Images Crash Your H5 App and How to Fix It with Chunked Lazy Loading

An H5 application suffered endless refresh loops due to a massive 4505 × 60615 px image, prompting a deep dive into browser rendering stages, performance profiling, and cross‑browser behavior, followed by practical solutions such as image size validation, server‑side checks, OSS processing, and chunked lazy‑loading techniques.

browser renderingfrontendimage optimization
0 likes · 21 min read
Why Huge Images Crash Your H5 App and How to Fix It with Chunked Lazy Loading
21CTO
21CTO
Dec 27, 2024 · Frontend Development

What Front‑End Innovations Will Redefine Web Development in 2025?

This article explores the major front‑end trends shaping 2025, including Angular Signals, RxJS enhancements, standalone components, new React server‑side features, Vue performance upgrades, next‑gen build tools like Vite 6 and Bun, and the growing impact of AI on developer workflows.

2025AIBuild Tools
0 likes · 10 min read
What Front‑End Innovations Will Redefine Web Development in 2025?
Kuaishou Frontend Engineering
Kuaishou Frontend Engineering
Dec 26, 2024 · Frontend Development

Automating Multi‑Format Sequence‑Frame Conversion for Web Animations

This article explains how a motion‑effects platform decouples design and development by automatically converting sequence‑frame animations into multiple formats (APNG, WEBP, AVIF, video), provides a runtime that dynamically selects the optimal format, and offers batch conversion APIs to improve performance and reduce engineering overhead.

Web Performanceanimationformat conversion
0 likes · 14 min read
Automating Multi‑Format Sequence‑Frame Conversion for Web Animations
Yang Money Pot Technology Team
Yang Money Pot Technology Team
Dec 26, 2024 · Frontend Development

Design and Implementation of a Multi‑CDN Disaster Recovery Mechanism for Frontend Resource Loading

This article presents a comprehensive multi‑CDN disaster‑recovery solution for frontend static resources, detailing the background, current issues, goals, SDK‑based architecture, monitoring and retry strategies, data‑reporting mechanisms, evaluation results, and future dynamic scheduling improvements.

CDNMonitoringRetry
0 likes · 12 min read
Design and Implementation of a Multi‑CDN Disaster Recovery Mechanism for Frontend Resource Loading
JavaScript
JavaScript
Dec 26, 2024 · Frontend Development

12 Essential Mobile Web Issues and How to Fix Them

This article outlines twelve common mobile web challenges—from 1px borders and 300 ms click delays to safe‑area handling and image loading optimization—providing concise CSS and JavaScript solutions to improve responsiveness, usability, and performance across diverse devices.

CSSJavaScriptPerformance
0 likes · 6 min read
12 Essential Mobile Web Issues and How to Fix Them
JavaScript
JavaScript
Dec 24, 2024 · Frontend Development

Master Mobile Web Adaptation: Proven Frontend Techniques

This guide outlines essential mobile‑frontend strategies—including viewport configuration, rem‑based flexible layouts, media queries, 1 px border fixes, safe‑area handling, responsive images, landscape support, and soft‑keyboard adjustments—providing complete code snippets to ensure seamless adaptation across diverse devices.

frontendmedia queriesmobile
0 likes · 7 min read
Master Mobile Web Adaptation: Proven Frontend Techniques
Code Mala Tang
Code Mala Tang
Dec 23, 2024 · Frontend Development

Explore ES2024: 5 Game-Changing JavaScript Features You Must Know

The article reviews five major ES2024 (ES15) JavaScript enhancements—including native groupBy, Promise.withResolvers, adjustable Buffer, Atomics.waitAsync, and a new regex v flag—explaining their usage, benefits, and code examples for modern web development.

New Featureses2024frontend
0 likes · 7 min read
Explore ES2024: 5 Game-Changing JavaScript Features You Must Know
JavaScript
JavaScript
Dec 20, 2024 · Frontend Development

8 Essential CSS Techniques for Clean, Maintainable, and Conflict‑Free Styles

This article presents eight practical CSS techniques—including variables, :is/:where selectors, aspect‑ratio, clamp(), gap, logical properties, :has(), and @layer—to help developers write concise, maintainable, and conflict‑free styles for modern web projects.

CSSfrontendstyle optimization
0 likes · 6 min read
8 Essential CSS Techniques for Clean, Maintainable, and Conflict‑Free Styles
Ctrip Technology
Ctrip Technology
Dec 19, 2024 · Frontend Development

Building an Enterprise‑Level Multi‑Brand, Multi‑Platform Design System at Ctrip

This article details Ctrip's approach to creating a scalable enterprise design system that supports multiple brands and platforms through modular design, theme configuration, cross‑platform component libraries, and automated workflows, ultimately improving design efficiency, consistency, and development productivity.

Modular Architecturecross-platformdesign system
0 likes · 16 min read
Building an Enterprise‑Level Multi‑Brand, Multi‑Platform Design System at Ctrip
Kuaishou Frontend Engineering
Kuaishou Frontend Engineering
Dec 17, 2024 · Game Development

How Crab’s WebGL Engine Powers Game‑Level Animations on the Web

This article explores the design and implementation of the Crab rendering engine, a WebGL‑based solution that combines high expressiveness, interactivity, and cross‑device compatibility to deliver game‑like animations for large‑scale activities, detailing its architecture, rendering pipeline, practical applications, and performance optimizations.

Animation EngineGame DevelopmentRendering
0 likes · 23 min read
How Crab’s WebGL Engine Powers Game‑Level Animations on the Web
JavaScript
JavaScript
Dec 16, 2024 · Frontend Development

Master Optional Chaining and Nullish Coalescing in JavaScript

This article explains how JavaScript's optional chaining (?.) and nullish coalescing (??) operators simplify safe access to nested object properties and provide reliable default values, replacing older verbose patterns with concise, readable code.

ES2020JavaScriptcode examples
0 likes · 7 min read
Master Optional Chaining and Nullish Coalescing in JavaScript
Eric Tech Circle
Eric Tech Circle
Dec 15, 2024 · Mobile Development

Mastering WeChat Mini Program Subscription Messages: From Setup to Code

This guide explains what WeChat Mini Program subscription messages are, outlines common use cases, and provides a step‑by‑step implementation process—including template creation, backend push configuration, frontend subscription requests, and server‑side message sending with code examples.

APIMiniProgramSubscriptionMessage
0 likes · 8 min read
Mastering WeChat Mini Program Subscription Messages: From Setup to Code
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 14, 2024 · Frontend Development

How to Transform Your Vue2 Codebase to Vue3 with Script Setup

This article walks through the practical steps for migrating a Vue2 project to Vue3, covering script‑setup syntax, composition‑API patterns, removal of mixins and global variables, file‑naming conventions, and reusable composable functions to achieve a cleaner, more maintainable codebase.

Composition APIScript SetupVue3
0 likes · 11 min read
How to Transform Your Vue2 Codebase to Vue3 with Script Setup
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 12, 2024 · Frontend Development

Understanding JavaScript setTimeout and setInterval and Implementing setInterval Using setTimeout

This article explains the fundamentals and execution order of JavaScript's setTimeout and setInterval functions, discusses their parameters and return values, demonstrates why setTimeout is asynchronous, shows how to cancel timers, and provides a custom recursive setTimeout solution that mimics setInterval behavior.

JavaScriptfrontendsetInterval
0 likes · 12 min read
Understanding JavaScript setTimeout and setInterval and Implementing setInterval Using setTimeout
Sohu Tech Products
Sohu Tech Products
Dec 11, 2024 · Frontend Development

Mastering React Rendering: When and How Components Re‑Render

This article explains React's rendering pipeline—including initial and update renders—identifies the factors that cause component re‑rendering, and demonstrates how to use React.memo, useMemo, and useCallback to eliminate unnecessary renders and improve performance.

PerformanceReActReact.memo
0 likes · 12 min read
Mastering React Rendering: When and How Components Re‑Render
Kuaishou Tech
Kuaishou Tech
Dec 11, 2024 · Frontend Development

Performance Governance and Optimization of Kuaishou Commercial Frontend Pages

This article presents a comprehensive analysis of page performance issues across Kuaishou's commercial front‑end projects, outlines the challenges of unified governance, B‑end experience measurement, and C‑end web‑native integration, and details the systematic optimization strategies and measurable results that significantly improved user experience and business metrics.

GovernanceKuaishouMetrics
0 likes · 23 min read
Performance Governance and Optimization of Kuaishou Commercial Frontend Pages
21CTO
21CTO
Dec 9, 2024 · Frontend Development

Which JavaScript Libraries Should You Drop by 2025? A Front‑End Guide

The article explains why legacy JavaScript libraries like jQuery, Moment.js, Lodash, Underscore.js and RequireJS are becoming obsolete, outlines the performance and maintenance drawbacks of keeping them, and recommends modern native APIs or lightweight alternatives to keep front‑end stacks fast and up‑to‑date by 2025.

2025JavaScriptfrontend
0 likes · 6 min read
Which JavaScript Libraries Should You Drop by 2025? A Front‑End Guide
21CTO
21CTO
Dec 7, 2024 · Frontend Development

What’s Shaping the Future of Frontend Development? Emerging Frameworks, AI, No‑Code, and More

This article explores the latest front‑end development trends—from emerging frameworks like Svelte and Solid, to AI‑powered interfaces, no‑code/low‑code platforms, progressive web apps, Web3/blockchain, micro‑frontend architecture, and immersive VR/AR—highlighting their impact on developers and businesses.

AIFrameworksMicro Frontends
0 likes · 13 min read
What’s Shaping the Future of Frontend Development? Emerging Frameworks, AI, No‑Code, and More
JD Tech Talk
JD Tech Talk
Dec 6, 2024 · Frontend Development

Performance Optimization Practices for Taro Mini‑Program: Skyline Rendering Engine and Resource Loading Improvements

During the Double‑11 promotion, our team applied a series of Taro mini‑program performance optimizations—including Skyline rendering engine migration, lazy loading of feed resources, image size reduction, and parallel API requests—to significantly reduce cold‑start, hot‑start, and rendering times, improving overall user experience.

Mini ProgramSkylineTaRO
0 likes · 8 min read
Performance Optimization Practices for Taro Mini‑Program: Skyline Rendering Engine and Resource Loading Improvements
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 6, 2024 · Frontend Development

Troubleshooting Common Issues in Wujie Micro‑Frontend Integration (WangEditor, Vue‑Office, Element‑Plus, etc.)

This article documents several practical problems encountered when using the Wujie micro‑frontend framework—such as editor selection failures, PDF preview white screens, missing Element‑Plus styles, tooltip offsets, custom event loss, and global style pollution—and provides concrete reproduction steps and detailed solutions for each.

Element PlusVueWangEditor
0 likes · 10 min read
Troubleshooting Common Issues in Wujie Micro‑Frontend Integration (WangEditor, Vue‑Office, Element‑Plus, etc.)
Qunhe Technology Quality Tech
Qunhe Technology Quality Tech
Dec 4, 2024 · Frontend Development

How a Front‑End Publishing Platform Boosted Release Quality and Speed

This article details how KuJiaLe's front‑end publishing platform was redesigned to solve chaotic environments, low‑efficiency releases, and poor quality by introducing standardized workflows, modular management, automated quality checkpoints, and future automation plans, resulting in dramatically higher on‑time delivery and stability.

Release Managementcontinuous integrationfrontend
0 likes · 11 min read
How a Front‑End Publishing Platform Boosted Release Quality and Speed
JavaScript
JavaScript
Dec 3, 2024 · Frontend Development

What’s New in the Latest CSS Tool Release? Key Features Explained

The latest update introduces resolve.conditions default values, enhanced JSON serialization, expanded HTML resource reference support, postcss‑load‑config integration, Sass’s modern API default, customizable CSS output filenames in library mode, and several other minor tweaks affecting a small user base.

CSSSassfrontend
0 likes · 1 min read
What’s New in the Latest CSS Tool Release? Key Features Explained
DaTaobao Tech
DaTaobao Tech
Dec 2, 2024 · Frontend Development

Client‑Side and Edge Caching Strategies for Membership Pages

The article outlines client‑cache and client‑snapshot techniques alongside an edge‑node ER‑cache that stores the first HTML chunk, explains a three‑layer routing model, and describes a head‑cache strategy with dynamic resource exclusion, skeleton UI snapshots, configurable switches, and per‑page cache durations to boost performance while preserving content freshness for membership pages.

EdgeWebcaching
0 likes · 11 min read
Client‑Side and Edge Caching Strategies for Membership Pages
Goodme Frontend Team
Goodme Frontend Team
Dec 2, 2024 · Frontend Development

How to Generate Paginated PDFs from HTML with html2canvas and jsPDF

This article explains how to convert HTML content—including text, images, and tables—into PDF files using html2canvas and jsPDF, and details a dynamic pagination technique to prevent content truncation across pages, while also covering performance and export considerations.

JavaScriptPaginationfrontend
0 likes · 19 min read
How to Generate Paginated PDFs from HTML with html2canvas and jsPDF
macrozheng
macrozheng
Nov 28, 2024 · Frontend Development

Essential Free Tools for Logos, Icons, and Illustrations for Developers

This guide compiles a curated list of free online tools and open‑source libraries for creating and sourcing logos, icons, and illustrations, offering quick customization options and direct download links to help developers enhance the visual assets of their web and mobile projects.

Design ToolsIconLogo
0 likes · 7 min read
Essential Free Tools for Logos, Icons, and Illustrations for Developers
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 28, 2024 · Frontend Development

Digital Agriculture Visualization: Technical Implementation with AMap, Three.js, GIS, and Vue

This article presents a comprehensive guide to building a digital agriculture visualization dashboard using AMap JSAPI, three.js, GIS tools, and Vue, covering requirement analysis, layer design, data processing, 3D model integration, animation, and interactive features for smart farming applications.

3D mappingAmapGIS
0 likes · 28 min read
Digital Agriculture Visualization: Technical Implementation with AMap, Three.js, GIS, and Vue
Selected Java Interview Questions
Selected Java Interview Questions
Nov 26, 2024 · Frontend Development

Typical JavaScript Bundle Sizes of Popular Websites in 2024

A 2024 analysis by Nikita Prokopov of uncompressed JavaScript file sizes across a range of popular websites shows sizes varying from a tiny 0.1 MB for jQuery to over 12 MB for heavyweight platforms like YouTube and Booking.com, highlighting the diversity of front‑end payloads.

JavaScriptWeb PerformanceWebsite Analysis
0 likes · 3 min read
Typical JavaScript Bundle Sizes of Popular Websites in 2024
Java Tech Enthusiast
Java Tech Enthusiast
Nov 25, 2024 · Frontend Development

Understanding Vue Composables (Hooks) and Their Usage

Vue’s reusable logic pattern, called Composables, are functions built with the Composition API that encapsulate reactive state via ref and lifecycle hooks, follow a use‑prefix naming convention, and let developers like the mouse‑tracker example share stateful behavior across components cleanly.

ComposablesComposition APIHooks
0 likes · 5 min read
Understanding Vue Composables (Hooks) and Their Usage
JD Tech Talk
JD Tech Talk
Nov 25, 2024 · Frontend Development

Designing a Multi‑Language Event System for Taro on Harmony OS

This article explains how Taro leverages C‑API to move runtime logic to C++ and builds a cross‑language event system that unifies ArkTS, JavaScript and C++ on Harmony OS, improving rendering performance, lifecycle management, and developer productivity.

C++Cross-languageEvent System
0 likes · 11 min read
Designing a Multi‑Language Event System for Taro on Harmony OS
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 23, 2024 · Frontend Development

Efficiently Rendering 100,000 Items with Time Slicing and Virtual List in Frontend Development

This article explains how to avoid UI freezes when rendering massive data sets in the browser by using time‑slicing techniques such as setTimeout or requestAnimationFrame together with document fragments, and by implementing a virtual list component in Vue to render only the visible portion of the data.

Time Slicingfrontendvirtual list
0 likes · 13 min read
Efficiently Rendering 100,000 Items with Time Slicing and Virtual List in Frontend Development
Qunhe Technology User Experience Design
Qunhe Technology User Experience Design
Nov 22, 2024 · Frontend Development

Taming Unstable 3D Tool Interactions with a Systematic Trigger Design

This article examines the challenges of unstable and inconsistent basic-function triggers in the Kujiale 3D design platform, analyzes root causes such as module isolation, compatibility gaps, and high coupling, and proposes a systematic, entropy-aware interaction architecture with layered trigger logic, progressive optimization strategies, and flexible user-centric configurations to improve stability, extensibility, and user adoption.

3D softwareUI designfrontend
0 likes · 11 min read
Taming Unstable 3D Tool Interactions with a Systematic Trigger Design
JavaScript
JavaScript
Nov 21, 2024 · Frontend Development

Why Promise.try Simplifies Async Error Handling in JavaScript

This article explains how Promise.try provides a cleaner, more consistent way to handle both synchronous and asynchronous errors in JavaScript, eliminating the need for repetitive try‑catch blocks and improving code readability.

JavaScriptPromisefrontend
0 likes · 4 min read
Why Promise.try Simplifies Async Error Handling in JavaScript
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 21, 2024 · Frontend Development

Implementing Electronic Signature, Image Merging, and Preview in Frontend using SignaturePad, html2canvas, and merge-images

This article explains how to build a front‑end electronic signature feature that merges a signature canvas with an HTML‑rendered document into a single preview image using SignaturePad, html2canvas, and merge-images, including code snippets and scaling adjustments.

electronic-signaturefrontendhtml2canvas
0 likes · 6 min read
Implementing Electronic Signature, Image Merging, and Preview in Frontend using SignaturePad, html2canvas, and merge-images
php Courses
php Courses
Nov 19, 2024 · Mobile Development

Full-Stack Mobile App Development with uniapp and ThinkPHP

This course, designed for developers with basic front‑end experience, teaches how to combine the uniapp framework and ThinkPHP backend to build high‑performance, cross‑platform mobile applications, covering topics such as data modeling, token authentication, middleware, API design, pagination, and deployment.

Full-StackThinkPHPUniApp
0 likes · 3 min read
Full-Stack Mobile App Development with uniapp and ThinkPHP
JavaScript
JavaScript
Nov 19, 2024 · Frontend Development

11 Must‑Use Open‑Source Tools for Freelance Developers (Front‑to‑Back)

Discover the 11 most popular open‑source projects that freelance developers rely on—from fast front‑end build tools like Vite and Tailwind CSS to back‑end frameworks such as Express, ORM Sequelize, real‑time Socket.IO, testing with Jest, code quality with ESLint and Prettier, and containerization with Docker—each with concise usage examples.

DockerJavaScriptbackend
0 likes · 11 min read
11 Must‑Use Open‑Source Tools for Freelance Developers (Front‑to‑Back)
Goodme Frontend Team
Goodme Frontend Team
Nov 18, 2024 · Frontend Development

Add Rotation and Scaling to Video Previews with React and Vime

This article explains how to implement video rotation, fullscreen handling, and proportional scaling in a React application using the Vime library and CSS transforms, covering container setup, control customization, and code examples for a seamless user experience.

CSS transformScalingVime
0 likes · 10 min read
Add Rotation and Scaling to Video Previews with React and Vime
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 16, 2024 · Frontend Development

Practical Implementation and Optimization of Large File Chunked Upload (Frontend Part)

This article presents a complete frontend solution for large file chunked uploading, covering requirement analysis, slice implementation, hash calculation with Web Workers, MerkleTree-based file identification, a PromisePool for concurrent uploads, real‑time progress tracking, and performance optimizations with detailed code examples.

Chunked Uploadfile uploadfrontend
0 likes · 21 min read
Practical Implementation and Optimization of Large File Chunked Upload (Frontend Part)
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 15, 2024 · Frontend Development

Front‑End Design Patterns in JavaScript: Creational, Structural, and Behavioral

This article introduces front‑end design patterns, explains the three main categories—creational, structural, and behavioral—lists ten common JavaScript patterns, and provides clear explanations and runnable code examples for each pattern to improve code readability, maintainability, and scalability.

BehavioralCreationalSoftware Architecture
0 likes · 16 min read
Front‑End Design Patterns in JavaScript: Creational, Structural, and Behavioral
Mashang Consumer UXC
Mashang Consumer UXC
Nov 12, 2024 · Frontend Development

Why Motion Design Matters: Boosting UX with Effective Animations

This article explores the importance of motion design in product interfaces, detailing its benefits such as reduced learning cost, brand differentiation, user conversion, and engagement, while providing practical guidance on tools, optimal animation durations, physical motion principles, output formats like GIF and Lottie, and effective handoff documentation for developers.

GIFLottieUI animation
0 likes · 9 min read
Why Motion Design Matters: Boosting UX with Effective Animations
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 12, 2024 · Frontend Development

Comprehensive Evaluation of Popular Rich Text Editors

This article provides a detailed comparison of major rich‑text editors—including TinyMCE, CKEditor, Tiptap, Quill, wangEditor, Jodit, Editor.js, Slate, medium‑editor, Squire, UEditor, and Summernote—covering their features, advantages, disadvantages, and suitability for various development scenarios.

CKEditorTinyMCEeditor comparison
0 likes · 14 min read
Comprehensive Evaluation of Popular Rich Text Editors
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Nov 11, 2024 · Frontend Development

Why Alova.JS Offers a Lighter, Simpler Alternative to Axios

Alova.JS is a lightweight HTTP request library that supports multiple adapters, cross‑framework usage, and TypeScript, offering a smaller bundle size (≈30% of axios), a concise API, and high‑performance request strategies, making it a compelling replacement for axios in modern web projects.

JavaScriptPerformanceTypeScript
0 likes · 11 min read
Why Alova.JS Offers a Lighter, Simpler Alternative to Axios
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 11, 2024 · Backend Development

Step-by-Step Guide to Deploying a Small Web Application to Alibaba Cloud with Frontend Packaging and Backend Setup

This article provides a comprehensive tutorial on configuring front‑end resource bundling, adjusting server settings, building and uploading SpringBoot back‑end modules, creating deployment scripts, managing environment‑specific properties, and implementing a Baidu Tieba hot‑search crawler, enabling a complete end‑to‑end cloud deployment.

CrawlerScriptSpringBoot
0 likes · 16 min read
Step-by-Step Guide to Deploying a Small Web Application to Alibaba Cloud with Frontend Packaging and Backend Setup
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 9, 2024 · Frontend Development

Implementing Frontend Version Update Detection with Git Revision Plugin and Webpack

This article explains how to detect frontend deployment changes and prompt users to refresh by generating a git‑hash JSON file with git‑revision‑webpack‑plugin, creating Vue mixins for version checking, and comparing hashed filenames in the built index.html, covering three practical solutions with their pros and cons.

GitVersioningfrontend
0 likes · 10 min read
Implementing Frontend Version Update Detection with Git Revision Plugin and Webpack
DeWu Technology
DeWu Technology
Nov 4, 2024 · Frontend Development

WebAssembly (Wasm): Concepts, Advantages, and Practical Rust Integration

WebAssembly (Wasm) is a portable binary format that runs near native speed in browsers, providing sandboxed security and modular deployment, though its ecosystem is still maturing; it shines in compute‑intensive tasks like scientific computing, gaming, and porting native code, and can be integrated with Rust via wasm‑bindgen and wasm‑pack to create npm‑compatible modules that outperform JavaScript on larger workloads, while requiring higher development effort.

CompilationJavaScriptPerformance
0 likes · 15 min read
WebAssembly (Wasm): Concepts, Advantages, and Practical Rust Integration
Goodme Frontend Team
Goodme Frontend Team
Nov 4, 2024 · Frontend Development

Boost Frontend Animation Efficiency with Galacean Effects and Lottie

This article explores how a growth‑marketing team streamlined complex front‑end animations by adopting design‑first workflows, leveraging Galacean Effects and Lottie, and solving compatibility, resource‑replacement, and performance challenges in mini‑programs and H5 pages.

GalaceanLottieanimation
0 likes · 10 min read
Boost Frontend Animation Efficiency with Galacean Effects and Lottie
Open Source Linux
Open Source Linux
Nov 4, 2024 · Frontend Development

How to Use JSON Hero: A Powerful JSON Viewer for Developers

JSON Hero is a lightweight, UI‑driven JSON tool that offers multiple viewing modes, easy local installation, direct online use, content previews, searchable tree structures, and shareable links, making JSON handling faster and more intuitive for developers.

InstallationUIViewer
0 likes · 3 min read
How to Use JSON Hero: A Powerful JSON Viewer for Developers
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 3, 2024 · Frontend Development

Performance Optimization of a Complex Real‑Time Table in a Financial Front‑End Application

This article details how a newly‑graduated front‑end developer tackled severe UI lag and ten‑second first‑screen loads caused by three synchronized tables with 400+ rows of real‑time data, using Vue 3 techniques such as consolidated scroll handling, viewport‑based lazy updates, throttling, and WebSocket‑driven data subscription.

frontendlazy-loadingscroll
0 likes · 16 min read
Performance Optimization of a Complex Real‑Time Table in a Financial Front‑End Application
Architect
Architect
Nov 2, 2024 · Frontend Development

How to Build Robust Dark Watermarks and Boost OCR Accuracy in Web Apps

This article walks through the evolution of watermark techniques, demonstrates how to harden a front‑end watermark against deletion, invisibility, and covering using MutationObserver and canvas, introduces a low‑visibility dark watermark with decode logic, and details OCR integration and optimization to improve recognition accuracy in screenshot‑search scenarios.

CanvasMutationObserverOCR
0 likes · 21 min read
How to Build Robust Dark Watermarks and Boost OCR Accuracy in Web Apps
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 2, 2024 · Frontend Development

Comprehensive Guide to Homepage Load Speed Optimization

This article provides a thorough, English-language guide to optimizing homepage loading speed, covering resource loading techniques, page rendering improvements, and practical Webpack, Nginx, and browser APIs with code examples for developers seeking performance gains.

frontendloadingwebpack
0 likes · 12 min read
Comprehensive Guide to Homepage Load Speed Optimization
JD Tech
JD Tech
Oct 30, 2024 · Frontend Development

AIGCDesign: Open-Source Cross-Platform AI Component Solution for Frontend Development

The article introduces AIGCDesign, an open‑source cross‑platform AI component library that extends traditional frontend UI kits with large‑language‑model capabilities, offering lightweight, configurable, and multi‑framework support for rapid AI‑driven application development across web, mobile, and native environments.

AIAIGCLowCode
0 likes · 12 min read
AIGCDesign: Open-Source Cross-Platform AI Component Solution for Frontend Development
IT Services Circle
IT Services Circle
Oct 30, 2024 · Frontend Development

A Guide to Modern Front‑End Drag‑And‑Drop Libraries and Migration Strategies

This article reviews the recent deprecation of react‑beautiful‑dnd and presents several modern front‑end drag‑and‑drop alternatives—including Pragmatic Drag and Drop, VueDraggablePlus, dnd‑kit, react‑dnd, and Swapy—while offering migration strategies, usage examples, and GitHub resources for each library.

Drag-and-DropLibraryReAct
0 likes · 6 min read
A Guide to Modern Front‑End Drag‑And‑Drop Libraries and Migration Strategies
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 29, 2024 · Frontend Development

Elegant Centering and Advanced Layout Techniques with margin:auto in Flexbox

This article explores how to achieve horizontal and vertical centering in CSS Flexbox using justify-content, align-items, and the more concise margin:auto approach, presenting multiple practical examples, code snippets, and advanced layout scenarios such as partial clustering, equal-width distribution, and dynamic spacing calculations.

CSSfrontendmargin auto
0 likes · 17 min read
Elegant Centering and Advanced Layout Techniques with margin:auto in Flexbox
37 Interactive Technology Team
37 Interactive Technology Team
Oct 28, 2024 · Frontend Development

Challenges and Solutions in AI‑Generated Front‑End Code for Admin Panels

After six months of using AI to generate front‑end code for internal admin panels, the team found API typings perfect but UI components frequently flawed, leading them to adopt a key‑based modular strategy that replaces code‑subtraction with code‑addition, leverages reusable component libraries, and uses regex/AST fixes to reliably meet internal standards.

AI code generationTypeScriptVue
0 likes · 9 min read
Challenges and Solutions in AI‑Generated Front‑End Code for Admin Panels
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 28, 2024 · Frontend Development

Master Vue.js Animations: From CSS Transitions to Advanced Effects

This guide walks you through creating dynamic page effects in Vue using CSS transitions, CSS animations, Vue's built‑in transition components, and third‑party libraries like animate.css, while sharing best practices, code snippets, and performance tips for clean, maintainable front‑end development.

CSS TransitionVue.jsWeb Development
0 likes · 13 min read
Master Vue.js Animations: From CSS Transitions to Advanced Effects
Goodme Frontend Team
Goodme Frontend Team
Oct 28, 2024 · Frontend Development

Preventing Day.js Locale Pollution in Large Frontend Projects with Static Analysis

This article recounts a date‑misalignment bug caused by an unintended Day.js locale change in a mini‑program, explains why the global locale must remain unique, and details a comprehensive static‑analysis solution using ESLint, custom Webpack loaders, and Babel plugins to intercept and block Day.js locale modifications at compile time.

DayjsESLintStatic Analysis
0 likes · 22 min read
Preventing Day.js Locale Pollution in Large Frontend Projects with Static Analysis
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Oct 27, 2024 · Frontend Development

How Shadcn UI Gained 73K Stars in Under Two Years

Shadcn UI, a React‑based component collection launched in early 2023, reached 73 K GitHub stars within two years by offering a highly customizable, copy‑and‑paste workflow, leveraging Tailwind CSS, Radix UI, TypeScript, and a simple CLI that together reshape the frontend component ecosystem.

ReActTailwind CSScomponent library
0 likes · 4 min read
How Shadcn UI Gained 73K Stars in Under Two Years
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 24, 2024 · Frontend Development

Integrating Unocss Icon Solution into a Vite Vue Project

This tutorial introduces common icon approaches, explains the Unocss icon scheme built on SVG and Iconify, and provides step‑by‑step instructions—including Vite project setup, configuration files, and usage examples—to help front‑end developers efficiently add scalable, color‑aware icons to Vue applications.

CSS IconsUnoCSSVite
0 likes · 8 min read
Integrating Unocss Icon Solution into a Vite Vue Project
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 18, 2024 · Frontend Development

Comprehensive Guide to Vue Component Writing Styles: Options API, Composition API, Setup Syntax Sugar, Render Functions, and JSX

This article systematically introduces the many ways to write Vue components—including the classic Options API, the modern Composition API with setup syntax sugar, hand‑written render functions using h or createVNode, and various JSX techniques—explaining their principles, code examples, and when to choose each approach.

ComponentJSXJavaScript
0 likes · 19 min read
Comprehensive Guide to Vue Component Writing Styles: Options API, Composition API, Setup Syntax Sugar, Render Functions, and JSX
Baidu MEUX
Baidu MEUX
Oct 16, 2024 · Product Management

How Baidu Optimized Its Gold Purchase Flow: Design Strategies and UI Overhaul

This article details Baidu's comprehensive redesign of its gold‑purchase journey, covering unified framework selection, order‑step consolidation for natural and ad traffic, multi‑dimensional UI upgrades, and the resulting conversion boost within the Baidu App ecosystem.

E‑commerceUI optimizationUX design
0 likes · 7 min read
How Baidu Optimized Its Gold Purchase Flow: Design Strategies and UI Overhaul
IT Services Circle
IT Services Circle
Oct 16, 2024 · Frontend Development

Why Front‑End Development Is Complex and Often Misunderstood

The article dispels the myth that front‑end development is simple by outlining common misconceptions, detailing the many technical, design, performance, security, and collaboration challenges involved, and emphasizing its critical role in delivering modern, responsive, and competitive web applications.

SPAUXarchitecture
0 likes · 9 min read
Why Front‑End Development Is Complex and Often Misunderstood
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 16, 2024 · Frontend Development

How to Listen to LocalStorage Changes Within the Same Browser Tab: Techniques and Implementations

This article explains why the native storage event only works across different tabs, evaluates traditional polling and proxy approaches, and presents four efficient solutions—including custom StorageEvent, CustomEvent, MessageChannel, and BroadcastChannel—along with practical React and Vue examples for real‑time localStorage monitoring.

JavaScriptReActVue
0 likes · 12 min read
How to Listen to LocalStorage Changes Within the Same Browser Tab: Techniques and Implementations
ZhongAn Tech Team
ZhongAn Tech Team
Oct 15, 2024 · Frontend Development

Implementation of an Agora‑Based Video Claim SDK for Insurance: Architecture, Features, and Integration

This article details the design and implementation of a video‑claim system for insurance using Agora video‑call technology, covering background, core features, system architecture, adapter‑pattern code, Web and mini‑program SDK integration, exception handling, and future AI‑driven enhancements.

AgoraInsuranceSDK
0 likes · 15 min read
Implementation of an Agora‑Based Video Claim SDK for Insurance: Architecture, Features, and Integration
FunTester
FunTester
Oct 12, 2024 · Frontend Development

Mastering JavaScript Asynchronous Programming: Callbacks, Promises, and async/await

JavaScript’s single‑threaded nature makes asynchronous programming essential, and this guide explains callbacks, promises (including states and chaining), and async/await syntax with clear examples, illustrating how each technique avoids blocking the main thread and improves code readability and error handling.

Async/AwaitAsynchronousJavaScript
0 likes · 9 min read
Mastering JavaScript Asynchronous Programming: Callbacks, Promises, and async/await
JD Retail Technology
JD Retail Technology
Oct 9, 2024 · Frontend Development

AIGCDesign: Open-Source Cross‑Platform AI Component Solution – Design, Architecture, and Implementation

The article introduces AIGCDesign, an open‑source cross‑platform AI component solution that combines traditional frontend libraries with large‑language‑model capabilities, outlines its design goals, technical architecture, lifecycle hooks, configuration examples, multi‑framework support, and real‑world business integration cases.

AIAIGCTaRO
0 likes · 12 min read
AIGCDesign: Open-Source Cross‑Platform AI Component Solution – Design, Architecture, and Implementation
Alibaba Cloud Developer
Alibaba Cloud Developer
Oct 9, 2024 · Frontend Development

Boost Web Performance: Master Preload, Prefetch, Preconnect & More

This article explores a range of web preloading techniques—including DNS‑prefetch, preconnect, preload, prefetch, prerender, the Speculation Rules API, streaming rendering, HTTP/2 push, and Early Hints—detailing how they reduce network latency, improve first‑paint times, and enhance overall user experience.

CDNPrefetchWeb Performance
0 likes · 20 min read
Boost Web Performance: Master Preload, Prefetch, Preconnect & More