Tagged articles
3129 articles
Page 9 of 32
IT Xianyu
IT Xianyu
Dec 18, 2023 · Frontend Development

Geeker-Admin: Open‑Source Vue3‑Based Backend Management Framework

Geeker-Admin is an open‑source admin panel built with Vue 3.3, TypeScript, Vite 5, Pinia and Element‑Plus, offering a rich ProTable component, dynamic routing, theme switching, i18n, extensive custom directives, and full linting and commit tooling for rapid frontend development.

TypeScriptViteVue
0 likes · 4 min read
Geeker-Admin: Open‑Source Vue3‑Based Backend Management Framework
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 18, 2023 · Frontend Development

Evolution of Varlet UI: Architecture, Monorepo, Design System, and Tooling in 2023

In this article the author, creator of the Vue3 mobile component library Varlet UI, shares the latest architectural changes, monorepo setup, design system, development tooling, testing, build outputs, documentation deployment, playground, and VSCode extensions, reflecting on lessons learned over the past two years.

Component LibraryViteVue
0 likes · 12 min read
Evolution of Varlet UI: Architecture, Monorepo, Design System, and Tooling in 2023
Goodme Frontend Team
Goodme Frontend Team
Dec 13, 2023 · Frontend Development

Unlocking Concurrency, JS Quirks, Security Risks & Canvas Collisions: Frontend Insights

This roundup highlights the latest frontend tools and deep‑dive articles, covering StyleX, Astro 4.0, Vitest 1.0, VS Code 1.85, lock mechanisms for single‑threaded concurrency, bizarre JavaScript behaviors, target="_blank" security flaws, plugin system designs, designer‑developer workflows, and canvas collision detection techniques.

CanvasJavaScriptfrontend
0 likes · 5 min read
Unlocking Concurrency, JS Quirks, Security Risks & Canvas Collisions: Frontend Insights
Ximalaya Technology Team
Ximalaya Technology Team
Dec 12, 2023 · Frontend Development

Performance Optimization of Cloud Editing Playback: Preloading and Latency Reduction

By analyzing latency sources and introducing a pre‑loading ‘prepare’ step with new player APIs, the cloud‑editing team reduced audio start‑up delays by roughly 200 ms on average—cutting half‑second waits to under three‑hundred milliseconds and markedly improving streamer workflow.

Latency Reductioncloud editingfrontend
0 likes · 12 min read
Performance Optimization of Cloud Editing Playback: Preloading and Latency Reduction
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 12, 2023 · Frontend Development

Deep Dive into Vite's Dependency Pre‑Bundling Process

This article explains why Vite is faster than bundlers like Webpack, introduces the concept of dependency pre‑bundling, walks through its implementation using esbuild plugins, and shows how to build a simplified custom Vite server that scans, resolves, and pre‑bundles third‑party modules.

JavaScriptPre‑bundlingVite
0 likes · 35 min read
Deep Dive into Vite's Dependency Pre‑Bundling Process
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 10, 2023 · Frontend Development

Introduction to Web Components: History, Concepts, Custom Elements, Shadow DOM, Template and Slot

This article provides a comprehensive overview of Web Components, covering their development timeline, core concepts such as Custom Elements, Shadow DOM, templates and slots, practical code examples, lifecycle callbacks, debugging tools, and real‑world usage scenarios for modern frontend development.

HTML TemplatesJavaScriptShadow DOM
0 likes · 12 min read
Introduction to Web Components: History, Concepts, Custom Elements, Shadow DOM, Template and Slot
Architect
Architect
Dec 8, 2023 · Frontend Development

How to Build a Reliable, Low‑Latency IM Chat for Customer Service – Front‑End Techniques Revealed

This article dissects the end‑to‑end technical workflow of sending a customer‑service IM message, covering reliability, real‑time delivery, ordering, idempotency, performance bottlenecks, async handling, requestAnimationFrame, protobuf migration, and user‑experience optimizations, while sharing concrete metrics and real‑world solutions.

IMMessage OrderingProtobuf
0 likes · 24 min read
How to Build a Reliable, Low‑Latency IM Chat for Customer Service – Front‑End Techniques Revealed
DevOps Coach
DevOps Coach
Dec 8, 2023 · Frontend Development

How to Add Elastic RUM Monitoring to a Hugo Site

This guide explains what Elastic Real User Monitoring (RUM) is, outlines its key benefits, and provides step‑by‑step instructions with code snippets for integrating the Elastic RUM JavaScript agent into a Hugo static site, including configuration parameters and how to view the collected data in Kibana.

APMHugoRUM
0 likes · 14 min read
How to Add Elastic RUM Monitoring to a Hugo Site
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Dec 8, 2023 · Frontend Development

Key Front-End Trends and Techniques to Watch in 2023

2023 saw rapid evolution in the front‑end ecosystem, highlighted by major events, a controversial Gemini AI demo, SkyWalking‑based performance and error monitoring, innovative text‑overflow handling, CSS techniques that boost long‑list rendering by up to seven times, and an automatic, non‑intrusive skeleton‑screen generation solution.

2023Skeleton Screenfrontend
0 likes · 4 min read
Key Front-End Trends and Techniques to Watch in 2023
Programmer DD
Programmer DD
Dec 7, 2023 · Frontend Development

Why JavaScript Is Essential for Modern Web Development: A Beginner’s Guide

This article introduces JavaScript’s origins, core characteristics, and versatile roles—from front‑end scripting in browsers to server‑side execution with Node.js—while explaining its event‑driven model, variable declarations, DOM interaction, and asynchronous programming features for beginners.

JavaScriptWeb Developmentevent loop
0 likes · 6 min read
Why JavaScript Is Essential for Modern Web Development: A Beginner’s Guide
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 7, 2023 · Frontend Development

Custom Ant Design Select Component with Integrated Table and Dumi Documentation Guide

This article explains how to create custom Ant Design select components that display additional information via integrated tables, covering form implementation, basic and advanced versions with infinite scrolling, handling Ant Design bugs, and documenting the components using Dumi, complete with code examples.

Ant DesignCustom SelectDocumentation
0 likes · 26 min read
Custom Ant Design Select Component with Integrated Table and Dumi Documentation Guide
DeWu Technology
DeWu Technology
Dec 6, 2023 · Frontend Development

Permission Design for Front-end Monorepo in Large-Scale Development

The article presents a practical permission‑management strategy for a large‑scale front‑end monorepo that merges Git‑hook validation with GitLab’s protected branches and role‑based access, defines a clear directory hierarchy, outlines workflow controls, and explores extensions such as fine‑grained ACLs and file‑access logging to prevent unauthorized file changes.

Code reviewGitLabaccess control
0 likes · 17 min read
Permission Design for Front-end Monorepo in Large-Scale Development
Bilibili Tech
Bilibili Tech
Dec 5, 2023 · Frontend Development

Jinkela Pipeline: A Front‑End DevOps Glue Tool for Simplifying Release Processes

Jinkela Pipeline is an experimental front‑end DevOps glue tool integrated into the Dejavu platform that unifies and automates release workflows—handling environment variables, mono‑repo structures, parallel GitLab jobs, and plugin extensions—to reduce manual steps, inconsistencies, and anxiety for developers while enabling low‑code pipeline composition and future ChatOps integration.

DeploymentMonorepoPipeline
0 likes · 26 min read
Jinkela Pipeline: A Front‑End DevOps Glue Tool for Simplifying Release Processes
Tencent Cloud Developer
Tencent Cloud Developer
Dec 5, 2023 · Frontend Development

Understanding the Evolution, Design, and Complexity of Modern Front-End Frameworks

The article traces the historical evolution of front‑end frameworks—from static pages and jQuery to modern component‑based libraries like React, Vue, and Svelte—explaining why added complexity and compile‑time features such as Svelte’s runes improve maintainability, reactivity, and cross‑platform capabilities while weighing each framework’s design philosophy and trade‑offs for developers.

DesignReactSvelte
0 likes · 27 min read
Understanding the Evolution, Design, and Complexity of Modern Front-End Frameworks
VMIC UED
VMIC UED
Dec 4, 2023 · Frontend Development

Mastering Navigation Design: From Architecture to Interactive Components

This comprehensive guide explains navigation design fundamentals, system classifications, and component choices, helping designers build clear, user‑friendly interfaces that guide users efficiently through digital products while avoiding common pitfalls.

Component DesignUI/UXfrontend
0 likes · 16 min read
Mastering Navigation Design: From Architecture to Interactive Components
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Dec 1, 2023 · Frontend Development

Why Developers Are Rethinking Element‑Plus, Ref vs Reactive, and Node Version Managers

This article critiques Element‑Plus’s API inconsistencies, debates Vue 3’s ref versus reactive usage, clarifies the v‑for versus v‑if priority question, introduces Volta as a superior Node version manager, examines ESLint versus Prettier decisions, and recounts Didi’s costly Kubernetes outage.

ESLintElement PlusKubernetes
0 likes · 4 min read
Why Developers Are Rethinking Element‑Plus, Ref vs Reactive, and Node Version Managers
政采云技术
政采云技术
Nov 29, 2023 · Frontend Development

API Failure Resilience Using CDN and IndexedDB Caching

The article presents a comprehensive strategy for handling API outages by storing data locally with IndexedDB, synchronizing updates through a CDN, and implementing Axios interceptors and Node‑based scheduled jobs to ensure seamless user experience without white‑screen failures.

APICDNIndexedDB
0 likes · 12 min read
API Failure Resilience Using CDN and IndexedDB Caching
JD Retail Technology
JD Retail Technology
Nov 28, 2023 · Frontend Development

Performance Optimization Best Practices for Taro Mini‑Program Development

This article presents a comprehensive set of performance optimization techniques for Taro mini‑program development, covering initial render improvements, update efficiency, long‑list handling with VirtualList and VirtualWaterfall, setData data reduction, scroll‑penetration prevention, preloading strategies, and an upcoming CompileMode feature.

CompileModeTaroVirtualList
0 likes · 13 min read
Performance Optimization Best Practices for Taro Mini‑Program Development
JavaScript
JavaScript
Nov 28, 2023 · Frontend Development

How to Ensure HTTP Requests Complete When Users Leave a Page

This article explains why browsers cancel pending requests during navigation, the risks of lost data, and demonstrates reliable solutions using JavaScript—first by awaiting fetch, then leveraging the fetch keepalive option—to guarantee logs reach the server without delaying page loads.

HTTPJavaScriptKeepalive
0 likes · 3 min read
How to Ensure HTTP Requests Complete When Users Leave a Page
php Courses
php Courses
Nov 27, 2023 · Frontend Development

Implementing Multi‑Window 3D Synchronization with three.js

This article explains how to create a pure‑frontend “quantum entanglement” effect by synchronizing multiple browser windows using three.js, detailing the index.html setup, the main.js logic for scene and window management, and the WindowManager class that tracks window shapes via localStorage.

JavaScriptThree.jsWebGL
0 likes · 13 min read
Implementing Multi‑Window 3D Synchronization with three.js
iQIYI Technical Product Team
iQIYI Technical Product Team
Nov 24, 2023 · Frontend Development

Performance and Experience Optimization of H5 Special Topic Pages in Mobile App WebView

By implementing offline caching of libraries, template pre‑rendering, native player embedding, split‑screen loading, API slimming, WebP image delivery, and UI tweaks such as title‑bar customization, hide‑nav flags, pull‑to‑refresh, early background color and placeholder optimization, the H5 special‑topic pages in the mobile app WebView achieve up to 60 % faster first‑screen loads, dramatically lower network usage, and a smoother, more immersive user experience.

H5MobileWebView
0 likes · 10 min read
Performance and Experience Optimization of H5 Special Topic Pages in Mobile App WebView
Sohu Tech Products
Sohu Tech Products
Nov 22, 2023 · Frontend Development

How Does Next.js v14 Implement React Server Components (RSC)?

This article explains the origins of React Server Components, how Next.js v14 integrates RSC and App Router, the three release channels (Latest, Canary, Experimental), and provides step‑by‑step guidance for using RSC both inside and outside of Next.js with code examples and webpack configuration.

Next.jsRSCReact
0 likes · 9 min read
How Does Next.js v14 Implement React Server Components (RSC)?
DeWu Technology
DeWu Technology
Nov 22, 2023 · Frontend Development

Chrome Proxy Plugin for Efficient Micro‑Frontend Development

A Chrome proxy plugin was built to intercept micro‑frontend requests and map online URLs to local development servers, eliminating the need to launch both parent and child apps, restoring hot‑module replacement speed, offering one‑click rule configuration, and achieving full coverage and faster development for DeWu’s team.

Chrome ExtensionProxydevelopment efficiency
0 likes · 16 min read
Chrome Proxy Plugin for Efficient Micro‑Frontend Development
ByteDance Data Platform
ByteDance Data Platform
Nov 22, 2023 · Frontend Development

How HookStore Revamps DataWind’s Frontend Data Flow with Redux and Hooks

This article explains how DataWind’s frontend team replaced the outdated Dva‑based data flow with a new Redux‑plus‑hook solution called HookStore, detailing the pain points of complex initialization, legacy async syntax, tight module coupling, and showing migration steps, code examples, and benefits such as multi‑instance support and OpenAPI decoupling.

Data FlowReactRedux
0 likes · 14 min read
How HookStore Revamps DataWind’s Frontend Data Flow with Redux and Hooks
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Nov 20, 2023 · Frontend Development

Low-Code Practices in NetEase Cloud Music's Mid-Platform Frontend Team

NetEase Cloud Music’s mid‑platform frontend team tackled fragmented product lines and low throughput by standardizing metadata, revamping cross‑team workflows, introducing bi‑weekly reviews, adopting a hybrid micro‑frontend architecture, and building reusable low‑code components and backend code‑generation tools, which doubled demand throughput while highlighting template benefits and remaining asset gaps.

NetEase Cloud Musicfrontendmicro-frontend
0 likes · 10 min read
Low-Code Practices in NetEase Cloud Music's Mid-Platform Frontend Team
Goodme Frontend Team
Goodme Frontend Team
Nov 19, 2023 · Frontend Development

How to Securely Add Page and Image Watermarks with Canvas and CSS

This article explains how to protect confidential business documents by implementing page‑level watermarks using canvas and pseudo‑elements, and how to add robust watermarks to images via OSS parameters or client‑side canvas processing, while preventing removal through MutationObserver.

CanvasJavaScriptOSS
0 likes · 16 min read
How to Securely Add Page and Image Watermarks with Canvas and CSS
vivo Internet Technology
vivo Internet Technology
Nov 15, 2023 · Frontend Development

Design and Implementation of a BI Filter Component Library (bi-filters)

The article details how the BI platform’s bulky, tightly‑coupled filter was refactored into a standalone, generic ‘bi‑filters’ library managed with Lerna and Vue‑CLI, enabling on‑demand imports, independent packaging, and a three‑layer design that improves extensibility, universality, robustness, reduces code size, and simplifies maintenance.

BIComponent DesignLibrary
0 likes · 13 min read
Design and Implementation of a BI Filter Component Library (bi-filters)
Architecture and Beyond
Architecture and Beyond
Nov 12, 2023 · Frontend Development

Designing a Yellow Banner System for User Notification During Service Outages

The article explains how a configurable yellow banner system can be used on web interfaces to promptly inform users about service disruptions, guide their actions, increase transparency, improve experience, and outline implementation considerations such as configurability, persistence, and independent deployment.

NotificationSystem DesignUser experience
0 likes · 6 min read
Designing a Yellow Banner System for User Notification During Service Outages
Weimob Technology Center
Weimob Technology Center
Nov 10, 2023 · Frontend Development

How Design Tokens Enable Consistent UI Across Platforms in Titian

This article explains how the Titian component library uses Design Tokens to abstract visual attributes like color, typography, spacing, and shadow, allowing seamless theme customization, global and component-level styling, dark mode support, and multi‑framework integration for consistent front‑end development.

Component LibraryReactTheme Customization
0 likes · 14 min read
How Design Tokens Enable Consistent UI Across Platforms in Titian
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Nov 10, 2023 · Frontend Development

Top Frontend Innovations: Memory Optimization, File Streaming, and New JS Features

This article curates recent frontend breakthroughs—including Electron memory tuning, printer integration, efficient file streaming, Chrome 117's SHA‑1 deprecation, native JavaScript array grouping, and continuous user‑experience improvement—offering practical insights for modern web developers.

JavaScriptUser experienceWeb Development
0 likes · 2 min read
Top Frontend Innovations: Memory Optimization, File Streaming, and New JS Features
Ant R&D Efficiency
Ant R&D Efficiency
Nov 9, 2023 · Frontend Development

Integrating CodeBlitz WebIDE with Alibaba Cloud Codeup: Features and Usage Guide

The guide explains how Alibaba Cloud Codeup integrates the CodeBlitz WebIDE, detailing its default WebIDE access, core features such as code browsing, search, syntax services, GitGraph and CodeRunnerForWeb, and provides step‑by‑step instructions for installing the IDE package, adding language packs, plugins, filesystem and third‑party Git service integrations, plus a lightweight editor component.

Alibaba CloudCodeBlitzCodeup
0 likes · 10 min read
Integrating CodeBlitz WebIDE with Alibaba Cloud Codeup: Features and Usage Guide
Huolala Tech
Huolala Tech
Nov 7, 2023 · Frontend Development

Why Does My Vue App Show a White Screen on Old Android Devices? Fixing Vite Legacy Compatibility

This article uses a fictional story to illustrate a front‑end white‑screen problem on an old Android phone, analyzes the root causes such as unsupported Chrome versions, missing globalThis and Vue loading failures, and provides a step‑by‑step Vite legacy downgrade solution with code examples and configuration tips.

CompatibilityLegacyVite
0 likes · 15 min read
Why Does My Vue App Show a White Screen on Old Android Devices? Fixing Vite Legacy Compatibility
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 7, 2023 · Frontend Development

Implementing Fixed, Variable, and Dynamic Height Virtual Lists with react-window

This article explains the core principles of virtual scrolling and provides complete React implementations for three types of virtual lists—fixed‑height, variable‑height, and dynamic‑height—using react-window, including detailed code snippets, performance considerations, and optimization suggestions.

Reactfrontendperformance
0 likes · 17 min read
Implementing Fixed, Variable, and Dynamic Height Virtual Lists with react-window
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Nov 3, 2023 · Frontend Development

Modern Frontend Insights: SVG, Code Standards, Next.js SQL, Vite, Node.js 21

This article surveys recent frontend developments, including detailed SVG rendering techniques, best‑practice code standards with ESLint, Prettier and Husky, emerging trends such as Next.js‑embedded SQL, Vite’s roadmap and Node.js 21’s Stream API upgrades, plus practical UX guidance for legacy browsers and a glimpse of a leading frontend team.

ESLintNext.jsSVG
0 likes · 3 min read
Modern Frontend Insights: SVG, Code Standards, Next.js SQL, Vite, Node.js 21
Ctrip Technology
Ctrip Technology
Nov 2, 2023 · Backend Development

Design and Implementation of the PGClowcode Low‑Code Platform at Ctrip

The article details the motivation, design, architecture, key features, deployment workflow, and future roadmap of Ctrip's PGClowcode low‑code platform, which enables rapid visual development of backend pages through a front‑end React UI and a Spring WebFlux backend, addressing common challenges in large‑scale internal tool development.

BackendCtripDeployment
0 likes · 21 min read
Design and Implementation of the PGClowcode Low‑Code Platform at Ctrip
HomeTech
HomeTech
Nov 1, 2023 · Frontend Development

Understanding and Optimizing Cumulative Layout Shift (CLS) in Web Performance

This article explains the background, definition, calculation methods, measurement techniques, and practical optimization strategies for Cumulative Layout Shift (CLS), a key web‑performance metric, and provides JavaScript code examples for tracking and reporting CLS values.

CLSJavaScriptWeb Performance
0 likes · 16 min read
Understanding and Optimizing Cumulative Layout Shift (CLS) in Web Performance
Laravel Tech Community
Laravel Tech Community
Oct 31, 2023 · Frontend Development

jQuery 4.0.0 Milestone Progress Reaches 99% Completion

The article reports that jQuery version 4.0.0 is 99% complete according to its GitHub milestone, with only one remaining issue related to ESLint upgrades, and highlights the library’s impact on modern JavaScript development.

DevelopmentESLintMilestone
0 likes · 3 min read
jQuery 4.0.0 Milestone Progress Reaches 99% Completion
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 31, 2023 · Frontend Development

User Behavior Recording Techniques: Video, Screenshot, and DOM Snapshot (rrweb) Comparison and Implementation

This article examines various user behavior recording methods—including WebRTC video capture, canvas-based screenshot recording, and DOM snapshot recording with rrweb—detailing their technical implementations, advantages, limitations, and suitable application scenarios for product analysis, debugging, and automated testing.

VueWebRTCfrontend
0 likes · 28 min read
User Behavior Recording Techniques: Video, Screenshot, and DOM Snapshot (rrweb) Comparison and Implementation
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 29, 2023 · Frontend Development

Understanding Front-End Engineering: From Module Systems to npm and webpack

This article explains front‑end engineering, tracing its evolution from simple page building to modern modular architectures, and details how tools like npm, CommonJS, AMD, CMD, ESModules and webpack address challenges such as scope pollution, code standards, resource optimization, testing, CI/CD, and team collaboration.

Engineeringfrontendmodularization
0 likes · 17 min read
Understanding Front-End Engineering: From Module Systems to npm and webpack
Architect
Architect
Oct 27, 2023 · Fundamentals

Can Clean Architecture Transform Your Codebase? A Deep Dive into Design

This article explains why software architecture matters, defines the essence of Clean Architecture, compares it with Hexagonal and DDD layered models, and walks through a practical, step‑by‑step process—from business analysis and domain modeling to layer implementation and code examples—showing how to reduce complexity and maintenance cost.

BackendClean ArchitectureDDD
0 likes · 21 min read
Can Clean Architecture Transform Your Codebase? A Deep Dive into Design
Tencent TDS Service
Tencent TDS Service
Oct 26, 2023 · Artificial Intelligence

Can AI Supercharge Low‑Code Dashboard Development? Lessons from Wuqi

This article explores how Wuqi integrates AI into its low‑code platform to automate UI generation, logic customization, and data analysis, discusses the DSL‑based architecture, multi‑AI task coordination, and evaluates scenarios where AI enhances efficiency versus when traditional low‑code remains preferable.

AIDSLDashboard
0 likes · 24 min read
Can AI Supercharge Low‑Code Dashboard Development? Lessons from Wuqi
ByteFE
ByteFE
Oct 25, 2023 · Frontend Development

Design and Implementation of a Frontend Version Upgrade Prompt for B2B Platforms

This article describes a comprehensive solution for notifying B2B web users about outdated frontend versions, covering the problem background, version number generation, trigger conditions, micro‑frontend adaptation, detailed plugin and React component code, integration steps for main and sub‑applications, debugging guidance, and measured user impact.

NotificationVersioningfrontend
0 likes · 16 min read
Design and Implementation of a Frontend Version Upgrade Prompt for B2B Platforms
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 25, 2023 · Frontend Development

Implementing Web Page Screenshot Functionality in the Browser: Techniques, Libraries, and Optimizations

This article explores how to capture and process screenshots of web pages directly in the browser, discussing canvas drawImage basics, pixel extraction, the trade‑offs of using html2canvas versus dom‑to‑image, performance and bundle size considerations, and alternative plugin‑based approaches.

Canvasdom to imagefrontend
0 likes · 18 min read
Implementing Web Page Screenshot Functionality in the Browser: Techniques, Libraries, and Optimizations
Alibaba Cloud Developer
Alibaba Cloud Developer
Oct 24, 2023 · Frontend Development

How to Refactor a Complex React Component for Easy Relocation

This article walks through a real‑world micro‑refactor of a React page, detailing the analysis of component dependencies, the step‑by‑step extraction of a tangled UI block into a reusable component, and the testing strategy that ensures the new code works without breaking existing functionality.

Component DesignReactTypeScript
0 likes · 12 min read
How to Refactor a Complex React Component for Easy Relocation
ByteFE
ByteFE
Oct 23, 2023 · Frontend Development

Master High‑Performance Data Tables with VTable: A Quick‑Start Guide

This guide introduces VTable, an open‑source high‑performance table component built on VRender, covering installation via npm or CDN, basic usage, table types, cell rendering options, interaction features, theming, and performance characteristics for modern web applications.

Data TableJavaScriptUI Component
0 likes · 9 min read
Master High‑Performance Data Tables with VTable: A Quick‑Start Guide
JD Tech
JD Tech
Oct 20, 2023 · Frontend Development

Common Methods for Listening to List Item Exposure in Frontend Development

This article explains why front‑end data‑collection (exposure) points are crucial, outlines three main techniques—estimating visibility from paginated data, listening to scroll events with bounding‑box calculations, and using the IntersectionObserver API—detailing their implementation, advantages, drawbacks, and best‑practice usage across H5, mini‑programs, and Taro.

Exposure TrackingIntersectionObserverMini Program
0 likes · 23 min read
Common Methods for Listening to List Item Exposure in Frontend Development
php Courses
php Courses
Oct 19, 2023 · Frontend Development

Popular Open-Source CSS Frameworks on GitHub

This article introduces several popular open-source CSS frameworks on GitHub, such as Bootstrap, Foundation, Bulma, Tailwind, UIkit, Milligram, Pure.css, and Tachyons, describing their features, usage, and repository statistics to help developers choose the right tool for efficient web design.

BootstrapCSSGitHub
0 likes · 6 min read
Popular Open-Source CSS Frameworks on GitHub
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 19, 2023 · Frontend Development

Integrating Monorepo with Micro‑Frontend Using pnpm and Micro‑App: Architecture, Implementation, and Deployment

This article explains how to combine Monorepo and micro‑frontend architectures using pnpm and Micro‑App, covering the concepts, technical selections, step‑by‑step setup of base and child applications, shared modules, configuration, code standards, mock services, Docker/Nginx deployment, and best practices for frontend development.

MonorepoVitefrontend
0 likes · 35 min read
Integrating Monorepo with Micro‑Frontend Using pnpm and Micro‑App: Architecture, Implementation, and Deployment
HomeTech
HomeTech
Oct 18, 2023 · Frontend Development

Web Page Performance Metrics and Optimization Practices

This article explains why web performance matters, introduces key user‑centric metrics such as First Contentful Paint, Largest Contentful Paint and Cumulative Layout Shift, describes how to measure them with tools like Chrome DevTools, Lighthouse and ftwo, and provides practical optimization techniques including gzip, HTTP/2, CDN, image handling, code splitting and Vue router lazy‑loading.

CDNMetricsVue
0 likes · 9 min read
Web Page Performance Metrics and Optimization Practices
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Oct 17, 2023 · Frontend Development

Supporting Core Homepage Scenarios with Visual Building and Low-Code: NetEase Cloud Music Case Study

NetEase Cloud Music’s Lingqu visual‑building platform lets a single front‑end developer drag‑and‑drop DSL cards to design, deploy and manage the high‑traffic Discovery and Music homepage flows, delivering near‑native performance, dynamic iteration, data‑decoupled sourcing, fine‑grained targeting and comprehensive quality‑assurance without traditional release cycles.

DSLfrontendperformance
0 likes · 11 min read
Supporting Core Homepage Scenarios with Visual Building and Low-Code: NetEase Cloud Music Case Study
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 16, 2023 · Frontend Development

Comprehensive Front‑End Code Review Checklist and Best Practices

This article presents a detailed front‑end code review guide covering quality, functionality, performance, security, testability, readability, reusability, compatibility, polyfill configuration, and practical testing examples such as Cypress end‑to‑end tests, all organized with clear checklists and code snippets.

Code reviewbest practicesfrontend
0 likes · 17 min read
Comprehensive Front‑End Code Review Checklist and Best Practices
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 14, 2023 · Frontend Development

Understanding Vue's Diff Algorithm: A Step‑by‑Step Guide

This article explains Vue's diff algorithm in detail, covering prerequisite concepts about VNode, left‑ and right‑side comparisons, handling arrays of different lengths, and the complete implementation with code examples to help developers grasp how Vue efficiently updates the DOM.

Diff AlgorithmJavaScriptVue
0 likes · 11 min read
Understanding Vue's Diff Algorithm: A Step‑by‑Step Guide
Ximalaya Technology Team
Ximalaya Technology Team
Oct 13, 2023 · Frontend Development

Understanding HTTP Request Parameter Formats and Content-Type

The article explains that HTTP request parameters can be sent as URL‑encoded query strings for GET requests or as various POST body formats—such as application/json, application/x-www-form-urlencoded, multipart/form-data, or text/xml—each requiring the correct Content‑Type header so the backend can parse the data correctly, with JavaScript utilities like FormData, URLSearchParams, or qs helping developers serialize the payload.

APIContent-TypeHTTP
0 likes · 8 min read
Understanding HTTP Request Parameter Formats and Content-Type
IT Services Circle
IT Services Circle
Oct 12, 2023 · Frontend Development

Integrating WASI into WebContainers: Enabling Multi‑Language Execution in the Browser

The article explains how StackBlitz's WebContainers, a browser‑based container environment, now fully integrates the WebAssembly System Interface (WASI), allowing near‑native speed, secure sandboxed execution of multiple languages such as Rust, Python, C/C++, and introducing new CLI tools and future language support.

BrowserMulti-languagePython
0 likes · 6 min read
Integrating WASI into WebContainers: Enabling Multi‑Language Execution in the Browser
ByteDance Web Infra
ByteDance Web Infra
Oct 12, 2023 · Frontend Development

Rspress 1.0 – A High‑Performance Static Site Generator Powered by Rust and Rspack

Rspress 1.0, an open‑source static site generator from ByteDance’s Web Infra team, leverages the Rust‑based Rspack bundler and MDX support to deliver fast build times, customizable themes, internationalization, multi‑version docs, plugin extensibility, and built‑in features such as search, preview, and view‑transition animations.

MDXRustfrontend
0 likes · 15 min read
Rspress 1.0 – A High‑Performance Static Site Generator Powered by Rust and Rspack
Baidu MEUX
Baidu MEUX
Oct 11, 2023 · Frontend Development

How Scenario‑Driven Design Revamps Baidu Search’s Design System

This article explains how Baidu Search’s design system was restructured using scenario‑driven thinking, detailing the challenges of asset redundancy and inconsistency, the three‑phase overhaul (unify, engineer, tool), and the resulting improvements in asset clarity, maintainability, and consumption efficiency.

Component LibraryUI/UXasset management
0 likes · 16 min read
How Scenario‑Driven Design Revamps Baidu Search’s Design System
HomeTech
HomeTech
Oct 11, 2023 · Frontend Development

Implementing a Sticky Tabs Component with Custom Scroll Behavior in React

This article explains how to build a customizable Tabs component with a sticky header, click‑to‑scroll navigation, and collapsible content sections using React, CSS position:sticky, IntersectionObserver, and JavaScript, providing complete code examples and compatibility notes for modern web and mobile applications.

CSSIntersectionObserverJavaScript
0 likes · 10 min read
Implementing a Sticky Tabs Component with Custom Scroll Behavior in React
Practical DevOps Architecture
Practical DevOps Architecture
Oct 10, 2023 · Fundamentals

Comprehensive Course Outline: Python, Django, Frontend Development, and K8s Dashboard Project

This article presents a detailed curriculum covering an opening ceremony, Python fundamentals and advanced topics, Django development (including ORM and authentication), frontend basics with HTML, CSS, JavaScript, jQuery, a Layui UI framework module, and a hands‑on K8s Dashboard web project, followed by recommended reading links.

Course OutlineDjangoPython
0 likes · 5 min read
Comprehensive Course Outline: Python, Django, Frontend Development, and K8s Dashboard Project
JD Tech
JD Tech
Oct 9, 2023 · Frontend Development

Design and Implementation of a Flexible H5 Navigation Bar Component for Mobile Applications

This article analyzes the limitations of native navigation bars on mobile pages, proposes a reusable H5 navigation‑bar component (@pango/navigation-bar) with performance, cost, and user‑experience benefits, details its architecture, configuration, code usage, exception handling, and adaptation for foldable screens, and outlines the open‑source plan.

ComponentConfigurationMobile Web
0 likes · 17 min read
Design and Implementation of a Flexible H5 Navigation Bar Component for Mobile Applications
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Oct 8, 2023 · Frontend Development

How Tango’s Open‑Source Low‑Code Engine Redefines Front‑End Development with AST‑Based Visual Builder

This article examines the design and implementation of Tango, an open‑source low‑code engine that leverages ESTree AST standards to enable bidirectional code‑to‑visual‑schema conversion, offering a progressive, source‑code‑driven visual development experience integrated with modern front‑end tooling.

ASTfrontendlow-code
0 likes · 10 min read
How Tango’s Open‑Source Low‑Code Engine Redefines Front‑End Development with AST‑Based Visual Builder
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 7, 2023 · Frontend Development

Why Adopt TypeScript in Frontend Development: Business Motivation, Error Analysis, Cost‑Benefit, and Implementation Plan

This article explains the business reasons for introducing TypeScript in a B‑end frontend product, analyzes common runtime type errors, compares TypeScript with plain JavaScript, evaluates costs, risks and benefits, and outlines a practical implementation roadmap.

TypeScriptcode qualitycost-benefit
0 likes · 8 min read
Why Adopt TypeScript in Frontend Development: Business Motivation, Error Analysis, Cost‑Benefit, and Implementation Plan
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 6, 2023 · Frontend Development

VSCode Tips, Shortcuts, and Configuration Guide for Frontend Developers

This article provides a comprehensive guide to VSCode for frontend developers, covering essential keyboard shortcuts, automatic formatting and lint fixing settings, custom snippet creation, recommended extensions, configuration synchronization, and the use of .editorconfig and .vscode directories to boost coding efficiency.

ExtensionsVSCodeeditorconfig
0 likes · 11 min read
VSCode Tips, Shortcuts, and Configuration Guide for Frontend Developers
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 5, 2023 · Frontend Development

Clean Code Practices and Tooling for Frontend Development

This article explains the concepts of external and internal code beauty, introduces essential frontend tooling such as ESLint, Prettier, Stylelint, husky, lint‑staged, EditorConfig, and CSSComb, and shares practical habits on documentation, naming, and commenting to help developers produce elegant, maintainable code.

ESLintGitPrettier
0 likes · 13 min read
Clean Code Practices and Tooling for Frontend Development
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 4, 2023 · Operations

Docker Basics and Step‑by‑Step Guide to Deploy Frontend and Node.js Applications

This article explains Docker fundamentals, compares containers with virtual machines, details Docker’s core components and common commands, and provides complete step‑by‑step instructions for packaging, building, running, automating, and pushing both a Vite‑based React frontend and an Express‑based Node.js backend using Nginx and shell scripts.

ContainerDeploymentNginx
0 likes · 17 min read
Docker Basics and Step‑by‑Step Guide to Deploy Frontend and Node.js Applications
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 1, 2023 · Frontend Development

A Comprehensive Guide to Building Drag‑and‑Drop Low‑Code Platforms

This article provides a systematic overview of drag‑and‑drop low‑code platforms, covering their advantages and drawbacks, core architecture (protocols, material area, canvas, property panel, top bar), implementation details with code examples, and best practices for extensibility, sandboxing, and code generation.

Component ArchitectureDrag-and-DropUI Builder
0 likes · 23 min read
A Comprehensive Guide to Building Drag‑and‑Drop Low‑Code Platforms
JD Tech
JD Tech
Sep 27, 2023 · Frontend Development

Core Front-End Technologies of JD Competition Ranking H5 Page

This article examines the core front‑end technologies employed in JD’s Competition Ranking H5 page, covering animation implementations, style configuration, skin switching, poster generation, debugging tools, request handling, and deployment scripts, providing practical insights and code examples for front‑end developers.

CSSH5Vue
0 likes · 22 min read
Core Front-End Technologies of JD Competition Ranking H5 Page
DeWu Technology
DeWu Technology
Sep 25, 2023 · R&D Management

Design and Architecture of a B‑End Low‑Code Platform

The article argues that B‑end applications need clear standards rather than technical hurdles, proposes a low‑code platform with front‑back separation into view, template, and engine layers using JSON Schema and a rule engine, and evaluates its benefits, trade‑offs, and implementation considerations.

B‑endarchitecturefrontend
0 likes · 9 min read
Design and Architecture of a B‑End Low‑Code Platform
Baidu Geek Talk
Baidu Geek Talk
Sep 25, 2023 · Frontend Development

How Baidu’s New Mini‑Program Compiler Boosted Build Speed by Up to 7×

Baidu’s mini‑program compiler was completely rebuilt with a self‑designed architecture, multi‑threading, full‑process caching and sourcemap optimizations, delivering 2‑7× faster builds, lower memory usage and smaller output while keeping compatibility with the old system.

Mini Programbuild toolscompiler
0 likes · 19 min read
How Baidu’s New Mini‑Program Compiler Boosted Build Speed by Up to 7×
php Courses
php Courses
Sep 25, 2023 · Backend Development

Implementing Data Merging with PHP Backend and Vue Frontend

This article demonstrates how to implement a data merging feature by creating MySQL tables, building a PHP API that retrieves and combines records from two tables, and developing a Vue.js front‑end that fetches and displays the merged data, complete with full code examples.

APIBackendPHP
0 likes · 5 min read
Implementing Data Merging with PHP Backend and Vue Frontend
Goodme Frontend Team
Goodme Frontend Team
Sep 25, 2023 · Frontend Development

How We Built a Drag‑Drop Electronic Menu Builder with SVG & React

This article details the design and implementation of a customizable electronic menu system that evolved from static images to an H5‑based, SVG‑driven, React-powered solution, covering business requirements, technology selection, data binding, rendering, store isolation, and offline stability.

PWASVGfrontend
0 likes · 15 min read
How We Built a Drag‑Drop Electronic Menu Builder with SVG & React
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 24, 2023 · Frontend Development

How to Grow as a Frontend Engineer: Skills, Mindset, and Best Practices

This article outlines the three pillars—professional skills, thoughtfulness, and experience techniques—that determine a frontend developer's level, provides concrete coding conventions, naming guidelines, refactoring advice, and product‑analysis strategies, and emphasizes continuous learning and technical‑debt management to accelerate career growth.

Career Developmentbest practicescoding standards
0 likes · 32 min read
How to Grow as a Frontend Engineer: Skills, Mindset, and Best Practices
macrozheng
macrozheng
Sep 23, 2023 · Frontend Development

Top Free Website Builders to Launch Your Site in Minutes

This guide introduces a curated list of ready-to-use website generators—including Mall, WordPress, Docsify, Dumi, Img Cook, Ant Design Landing, Tencent Rabbit Nest, Baidu Analytics, One Nav, Discuz, and popular admin templates—showcasing their key features, deployment methods, and how they enable rapid site creation without deep coding.

BackendWordPressfrontend
0 likes · 10 min read
Top Free Website Builders to Launch Your Site in Minutes
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Sep 22, 2023 · Frontend Development

Front-End: React Alternatives, Cross-Platform, H5 Mobile, Chrome 117 & Low-Code

This article surveys recent front‑end developments, critiquing React’s perceived stagnation and proposing alternatives, explains cross‑platform compilation techniques, outlines H5 mobile adaptation principles, highlights new Chrome 117 DevTools features, and introduces Huawei Cloud’s TinyEngine low‑code engine for rapid application delivery.

ChromeMobilecross‑platform
0 likes · 4 min read
Front-End: React Alternatives, Cross-Platform, H5 Mobile, Chrome 117 & Low-Code
php Courses
php Courses
Sep 22, 2023 · Frontend Development

19 Common JavaScript Performance Pitfalls and How to Avoid Them

This article identifies nineteen common performance pitfalls in JavaScript and Node.js applications—ranging from improper variable scope and inefficient DOM manipulation to blocking I/O, unoptimized loops, and excessive dependencies—providing illustrative code examples and actionable solutions to improve speed and responsiveness.

JavaScriptNode.jsbest practices
0 likes · 16 min read
19 Common JavaScript Performance Pitfalls and How to Avoid Them
Continuous Delivery 2.0
Continuous Delivery 2.0
Sep 22, 2023 · Frontend Development

Applying the Front Door First Principle to UI Component Testing

The article explains the “front door first” principle for UI component testing, showing how a disabled Buy button can be missed by unit tests, demonstrates proper interaction‑based tests with code examples, discusses interface design and mock usage, and concludes with a promotion for a Python continuous‑deployment course.

UI testingfront door principlefrontend
0 likes · 6 min read
Applying the Front Door First Principle to UI Component Testing
21CTO
21CTO
Sep 21, 2023 · Frontend Development

What’s New in Next.js 13.5? Key Features and Performance Boosts Explained

Next.js 13.5, the latest version of Vercel’s React‑based full‑stack framework, introduces significant performance improvements, new middleware capabilities, enhanced image handling, and expanded documentation, while supporting edge runtime, IPv6, and experimental features, positioning it as a leading tool for modern web development.

ReactVercelWeb Development
0 likes · 7 min read
What’s New in Next.js 13.5? Key Features and Performance Boosts Explained
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 21, 2023 · Frontend Development

Implementing Web Page Screenshot in Frontend: Techniques, Libraries, and Optimization

This article explores the challenges and solutions for implementing a web‑page screenshot feature, comparing canvas drawImage, html2canvas, dom‑to‑image, and Chrome extension approaches, while discussing performance, bundle size, and practical code examples for extracting and processing pixel data.

CanvasImage Processingdom to image
0 likes · 17 min read
Implementing Web Page Screenshot in Frontend: Techniques, Libraries, and Optimization
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 20, 2023 · Frontend Development

Commonly Used Lodash Methods for Frontend Development

This article introduces essential Lodash functions for handling data in front‑end projects, covering array utilities, object helpers, and practical functions such as deep cloning, debouncing, and flow composition, complete with code examples and real‑world usage tips.

Utility Librarydata manipulationfrontend
0 likes · 15 min read
Commonly Used Lodash Methods for Frontend Development