Tagged articles

frontend

3169 articles · Page 2 of 32
AI Insight Log
AI Insight Log
Jan 15, 2026 · Frontend Development

Vercel Packages a Decade of React Best Practices into an Open‑Source AI Skill

Vercel has open‑sourced a structured "react‑best‑practices" Skill that encodes ten years of React and Next.js performance wisdom, prioritizes eight categories from critical waterfall‑flow elimination to low‑impact tweaks, and equips AI agents to automatically avoid common inefficiencies such as unnecessary bundle bloat and async‑await pitfalls.

AI AgentNext.jsPerformance Optimization
0 likes · 6 min read
Vercel Packages a Decade of React Best Practices into an Open‑Source AI Skill
IT Services Circle
IT Services Circle
Jan 12, 2026 · Frontend Development

8 Chrome DevTools Tricks Every Frontend Developer Should Know

This article presents eight practical Chrome DevTools techniques—including designMode editing, request replay, local overrides, quick fetch copying, request filtering, DOM selection shortcuts, on‑the‑fly npm installation, and fast source navigation—to boost debugging efficiency and streamline front‑end workflows.

Chrome DevToolsNetworkTips
0 likes · 6 min read
8 Chrome DevTools Tricks Every Frontend Developer Should Know
JavaScript
JavaScript
Jan 10, 2026 · Frontend Development

Why Vue3’s Composition API Beats Mixins: Benefits, Code & Migration

Vue3 replaces the problematic mixins pattern of Vue2 with a powerful Composition API, offering explicit dependencies, clearer source tracing, better TypeScript support, and easier maintenance, as illustrated by code examples and a real‑world fintech migration case.

Composition APITypeScriptVue3
0 likes · 5 min read
Why Vue3’s Composition API Beats Mixins: Benefits, Code & Migration
Tencent Tech
Tencent Tech
Jan 9, 2026 · Frontend Development

Build an AI‑Powered WeChat Mini Program Using Free CloudBase Resources

This step‑by‑step guide shows WeChat Mini Program developers how to register, join the AI Mini Program Growth Plan, claim free CloudBase cloud and AI token resources, connect CloudBase via CodeBuddy, configure project templates, develop AI‑driven features, and debug the app with the WeChat Developer Tools.

CloudBaseCodeBuddyMini Program
0 likes · 7 min read
Build an AI‑Powered WeChat Mini Program Using Free CloudBase Resources
Frontend AI Walk
Frontend AI Walk
Jan 9, 2026 · Frontend Development

From Pitfalls to Skill: Implementing a Peekable Horizontal Card Swipe with Vant

This article walks through common issues when using Vant's van-swipe for a horizontal card list—such as the last card being clipped and the peek effect being hidden—and presents a three‑layer nesting solution with detailed CSS, Vue code, a self‑test checklist, and a reusable skill definition to streamline future development.

VantVuecss
0 likes · 15 min read
From Pitfalls to Skill: Implementing a Peekable Horizontal Card Swipe with Vant
JavaScript
JavaScript
Jan 9, 2026 · Frontend Development

Why Overusing !important Breaks Your CSS and How to Fix It

The article explains how excessive use of the !important declaration creates CSS specificity wars, makes styles hard to maintain and debug, and offers practical techniques—including ID selectors, selector chaining, attribute selectors, repeated selectors, pseudo‑classes, and BEM architecture—to manage specificity responsibly.

BEMSpecificitybest practices
0 likes · 6 min read
Why Overusing !important Breaks Your CSS and How to Fix It
JavaScript
JavaScript
Jan 6, 2026 · Frontend Development

How to Auto‑Detect Front‑End Code Updates and Prompt Users to Refresh

This article explains why automatic update detection is essential for web apps, compares polling version files with server‑push techniques like SSE and WebSockets, and provides practical implementation steps and UX guidelines for prompting users to refresh.

PollingSSEWebSocket
0 likes · 6 min read
How to Auto‑Detect Front‑End Code Updates and Prompt Users to Refresh
DeWu Technology
DeWu Technology
Jan 5, 2026 · Frontend Development

How a Frontend Monorepo Boosted Code Quality and Release Stability at Scale

This article details the governance framework, key metrics, and concrete engineering practices used to improve Git metadata performance, code quality scoring, lint enforcement, workflow checkpoints, and code duplication reduction for a large‑scale frontend monorepo, resulting in measurable stability gains.

Stabilitycode qualityfrontend
0 likes · 15 min read
How a Frontend Monorepo Boosted Code Quality and Release Stability at Scale
JavaEdge
JavaEdge
Jan 4, 2026 · Frontend Development

Automate Frontend Deployment with GitHub Actions and Docker: A Step‑by‑Step Guide

This article explains the common challenges of deploying front‑end projects, outlines how to set up an automated build and release pipeline using Docker and GitHub Actions, and provides practical code snippets and best‑practice tips for pre‑release, roll‑back, and post‑deployment notifications.

AutomationCI/CDGitHub Actions
0 likes · 9 min read
Automate Frontend Deployment with GitHub Actions and Docker: A Step‑by‑Step Guide
JavaScript
JavaScript
Jan 4, 2026 · Frontend Development

Mastering JavaScript’s ‘this’: 4 Binding Rules and Arrow Function Secrets

This article explains why the JavaScript this keyword is notoriously tricky, demonstrates its behavior with concrete examples, outlines the four binding rules (default, implicit, explicit, new), shows how arrow functions simplify this handling, and offers practical best‑practice tips for writing robust code.

Arrow FunctionsBindingJavaScript
0 likes · 6 min read
Mastering JavaScript’s ‘this’: 4 Binding Rules and Arrow Function Secrets
Node.js Tech Stack
Node.js Tech Stack
Jan 4, 2026 · Frontend Development

Undo Redux? How Boris Cherny’s Undux Redefined State Management

The article revisits Undux, the minimalist state‑management library created by Anthropic’s Claude Code founder Boris Cherny out of frustration with Redux, examines its type‑safe, no‑boilerplate API, compares code snippets with Redux’s workflow, and reflects on its legacy and lessons for modern React development.

ReActReduxState Management
0 likes · 6 min read
Undo Redux? How Boris Cherny’s Undux Redefined State Management
JavaScript
JavaScript
Jan 1, 2026 · Information Security

Why Storing JWT in localStorage Is No Longer Safe and What to Use Instead

Storing JWT tokens in localStorage has become a serious security risk because XSS attacks can steal them, so developers should adopt safer alternatives such as HttpOnly cookies, BFF‑backed sessions, or Service Worker‑based in‑memory storage, each with its own trade‑offs.

BFFCSRFJWT
0 likes · 10 min read
Why Storing JWT in localStorage Is No Longer Safe and What to Use Instead
JavaScript
JavaScript
Dec 31, 2025 · Frontend Development

7 Reliable Alternatives to setTimeout for Precise JavaScript Timing

The article outlines seven browser‑based techniques—including requestAnimationFrame, setInterval, requestIdleCallback, Web Workers, Promise + async/await, the Web Animations API, and Intersection Observer—each offering higher accuracy, better resource handling, or smoother execution than the traditional setTimeout timer.

JavaScriptTimersWeb APIs
0 likes · 4 min read
7 Reliable Alternatives to setTimeout for Precise JavaScript Timing
JavaScript
JavaScript
Dec 30, 2025 · Frontend Development

Why document.domain Is Being Deprecated and How to Migrate Your Web Apps

This article explains the background and security concerns behind the deprecation of the JavaScript document.domain API, details browser warnings, and provides a step‑by‑step migration guide using postMessage, Channel Messaging, and proper CORS configuration to keep web applications functional.

Cross-Origindeprecationdocument.domain
0 likes · 5 min read
Why document.domain Is Being Deprecated and How to Migrate Your Web Apps
JavaScript
JavaScript
Dec 29, 2025 · Frontend Development

Master Concurrent JavaScript: Replace Promise.all with Promise.allSettled

While Promise.all is the traditional way to run multiple asynchronous operations in JavaScript, it aborts the whole batch when any promise rejects, making it impossible to know which calls succeeded; Promise.allSettled overcomes this by waiting for all promises and providing a detailed status for each result.

AsynchronousJavaScriptPromise
0 likes · 5 min read
Master Concurrent JavaScript: Replace Promise.all with Promise.allSettled
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 28, 2025 · Frontend Development

How to Collaborate with AI to Build a Complete UnoCSS Setup for UniApp Vue3 Projects

This article demonstrates a step‑by‑step, multi‑round dialogue with the AI assistant TRAE SOLO to progressively configure UnoCSS for a UniApp + Vue3 + Vite project, covering initial planning, dependency installation, platform‑specific fixes, shortcut creation, dynamic class handling, and component development.

AI collaborationConfigurationUnoCSS
0 likes · 18 min read
How to Collaborate with AI to Build a Complete UnoCSS Setup for UniApp Vue3 Projects
JavaScript
JavaScript
Dec 27, 2025 · Frontend Development

Detecting Page Exit: Best APIs and Practices for Reliable Data Reporting

This guide explains how to detect when a user leaves a web page using modern APIs like Page Visibility, beforeunload/unload, sendBeacon, and pagehide, compares their advantages and drawbacks, provides code snippets, and offers practical recommendations for reliable data reporting and UI handling.

Web Performancebrowser APIfrontend
0 likes · 8 min read
Detecting Page Exit: Best APIs and Practices for Reliable Data Reporting
JavaScript
JavaScript
Dec 24, 2025 · Frontend Development

Beyond the Classic for Loop: Modern JavaScript Iteration Techniques

This article examines why traditional JavaScript for loops are often suboptimal and introduces more readable, functional, and powerful alternatives such as array methods, for...of, for...in, and the spread operator, while also outlining scenarios where the classic for loop still shines.

JavaScriptarray methodses6
0 likes · 7 min read
Beyond the Classic for Loop: Modern JavaScript Iteration Techniques
Frontend AI Walk
Frontend AI Walk
Dec 24, 2025 · Frontend Development

Build AI Apps in the Frontend with TanStack AI: A Step‑by‑Step Guide

This tutorial walks frontend developers through TanStack AI, a type‑safe, vendor‑agnostic SDK that lets you integrate multiple AI models into React/TS projects, covering core concepts, installation, code examples, advanced tool usage, and a detailed comparison with alternative solutions.

AI SDKReActTanStack AI
0 likes · 11 min read
Build AI Apps in the Frontend with TanStack AI: A Step‑by‑Step Guide
phodal
phodal
Dec 23, 2025 · Frontend Development

Why Frontend Must Evolve for the Agentic Era: From UI to an Executable Workbench

As AI agents shift from assistants to autonomous executors, traditional GUIs become bottlenecks, prompting a redefinition of frontend architecture into a contract‑driven, observable, and controllable execution interface built on DSLs, NanoDSL, and a clear migration path.

AIUI architectureagentic
0 likes · 16 min read
Why Frontend Must Evolve for the Agentic Era: From UI to an Executable Workbench
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 23, 2025 · Frontend Development

Generate Multi‑Page PDFs Directly in the Browser with dompdf.js

dompdf.js v1.1.0 lets developers convert HTML to searchable, lightweight, multi‑page PDFs entirely on the front end, fixing blur, large size, and inaccurate pagination issues, and provides features such as custom headers/footers, encryption, compression, font handling, and browser‑compatible rendering options.

EncryptionJavaScriptdompdf.js
0 likes · 12 min read
Generate Multi‑Page PDFs Directly in the Browser with dompdf.js
JavaScript
JavaScript
Dec 21, 2025 · Frontend Development

Why IndexedDB Outperforms localStorage for Modern Web Apps

This article examines the security, performance, capacity, and query limitations of localStorage, explains how IndexedDB addresses each issue with asynchronous APIs, larger storage, stronger security, and advanced indexing, and introduces helper libraries that simplify its use.

IndexedDBfrontendlocalStorage
0 likes · 5 min read
Why IndexedDB Outperforms localStorage for Modern Web Apps
Frontend AI Walk
Frontend AI Walk
Dec 20, 2025 · Frontend Development

Front‑End Engineers at Risk in the AI Era: How to Evolve and Stay Competitive

The article analyzes how AI tools like Cursor and Antigravity are reshaping front‑end work, identifying three high‑risk developer profiles—UI translators, CRUD‑focused API workers, and framework‑obsessed syntax masters—and offers concrete strategies for evolving into system designers and AI‑augmented full‑stack creators.

AIFull-StackTypeScript
0 likes · 14 min read
Front‑End Engineers at Risk in the AI Era: How to Evolve and Stay Competitive
JD Tech
JD Tech
Dec 18, 2025 · Backend Development

Can AI Prompts Supercharge Your Backend, Frontend, and Big Data Projects?

This article showcases a series of real‑world development cases—from implementing a guided inventory task in a Java backend and generating Vue rule code, to writing unit tests, analyzing report data, converting SQL to Hive, debugging startup errors, publishing Maven APIs, optimizing slow SQL queries, and resolving MySQL deadlocks—demonstrating how AI‑driven prompts can accelerate coding, testing, and troubleshooting across multiple domains.

SQLbackendbigdata
0 likes · 31 min read
Can AI Prompts Supercharge Your Backend, Frontend, and Big Data Projects?
Sohu Tech Products
Sohu Tech Products
Dec 17, 2025 · Frontend Development

How Frontend Engineering Evolved: Choosing Between Webpack, Vite, and Rspack

This article traces the evolution of frontend engineering from static pages to modern modular workflows, explains the core responsibilities of bundlers, compares Webpack, Vite, and Rspack in terms of architecture, performance, configuration complexity, and ecosystem, and offers guidance on selecting the right tool for a project.

RspackVitebundling
0 likes · 23 min read
How Frontend Engineering Evolved: Choosing Between Webpack, Vite, and Rspack
JavaScript
JavaScript
Dec 17, 2025 · Frontend Development

Why vw and clamp() Are Replacing px and rem for Fluid Layouts

The article explains how modern CSS is shifting from fixed pixel and rem units to viewport‑based vw and the clamp() function, offering truly fluid, boundary‑controlled layouts that scale smoothly across any screen size while preserving accessibility where needed.

VWclampcss
0 likes · 5 min read
Why vw and clamp() Are Replacing px and rem for Fluid Layouts
JavaScript
JavaScript
Dec 16, 2025 · Frontend Development

Why Timestamp+Random Fails and How crypto.randomUUID() Guarantees Truly Unique IDs

This article explains common pitfalls of generating unique IDs with timestamps and simple counters in JavaScript, demonstrates why those methods can collide under high concurrency, and shows how the built‑in crypto.randomUUID() provides a standards‑based, cryptographically secure solution.

JavaScriptUUIDbest-practices
0 likes · 5 min read
Why Timestamp+Random Fails and How crypto.randomUUID() Guarantees Truly Unique IDs
大转转FE
大转转FE
Dec 15, 2025 · Frontend Development

From Static Pages to Modern Bundlers: How Webpack, Vite, and Rspack Evolve Frontend Engineering

This article traces the evolution of frontend engineering from static HTML pages to modular development, explains the core responsibilities of bundlers, compares Webpack, Vite, and Rspack in terms of architecture, performance, configuration complexity, and ecosystem support, and offers guidance on selecting the right tool for a project.

RspackVitebundlers
0 likes · 24 min read
From Static Pages to Modern Bundlers: How Webpack, Vite, and Rspack Evolve Frontend Engineering
Instant Consumer Technology Team
Instant Consumer Technology Team
Dec 12, 2025 · Artificial Intelligence

7 Must‑Try Open‑Source Tools to Supercharge Your Development (AI, UI, and More)

This article curates seven noteworthy open‑source projects—from a Linux‑based Windows app runner and a modern admin dashboard to AI‑focused tools like ComfyUI‑Manager, Claude quickstarts, and real‑time Whisper transcription—providing concise descriptions and direct repository links for developers seeking practical resources.

AIJavaScriptLinux
0 likes · 7 min read
7 Must‑Try Open‑Source Tools to Supercharge Your Development (AI, UI, and More)
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 9, 2025 · Frontend Development

Building a Music Player UI in Minutes with TRAE SOLO AI

The author demonstrates how TRAE SOLO's AI-powered code generation quickly created a complete music player web page, detailing the initial HTML scaffold, automatic CSS styling, layout fixes, and final deployment, all illustrated with code snippets and screenshots.

AI code generationHTMLTrae Solo
0 likes · 12 min read
Building a Music Player UI in Minutes with TRAE SOLO AI
FunTester
FunTester
Dec 9, 2025 · Frontend Development

Mastering Ant Design Popups: Fix Overlay Issues with getPopupContainer

This guide explains why Ant Design dropdowns, tooltips, and popovers are often hidden or misaligned, how the default rendering to document.body causes these problems, and demonstrates practical use of the getPopupContainer property to control popup mounting and eliminate visual bugs in React applications.

Ant DesignJavaScriptReAct
0 likes · 7 min read
Mastering Ant Design Popups: Fix Overlay Issues with getPopupContainer
Fun with Large Models
Fun with Large Models
Dec 7, 2025 · Frontend Development

Building a Multimodal RAG Front‑End with Trae Solo: A Vibe‑Coding Guide

This article walks through a three‑step Vibe‑Coding workflow—structured prompt creation, prompt optimization with DeepSeek, and precise bug‑fix guidance—to automatically generate, refine, and extend a React + TypeScript front‑end for a multimodal RAG system using Trae Solo, covering architecture, streaming chat, and PDF citation features.

AI programmingLangChainRAG
0 likes · 22 min read
Building a Multimodal RAG Front‑End with Trae Solo: A Vibe‑Coding Guide
High Availability Architecture
High Availability Architecture
Dec 5, 2025 · Frontend Development

Mastering Real-Time Web Communication: WebSocket, SSE, WebRTC & Polling Explained

This comprehensive guide explores the core concepts, protocols, implementation steps, and typical use cases of WebSocket, Server‑Sent Events, WebRTC, and traditional polling, comparing their strengths and weaknesses to help developers choose the right real‑time communication technique for web applications.

PollingSSEWeb Development
0 likes · 21 min read
Mastering Real-Time Web Communication: WebSocket, SSE, WebRTC & Polling Explained
Architect's Journey
Architect's Journey
Dec 4, 2025 · Artificial Intelligence

Hands‑On Review of Alibaba Qoder: 8 Practical Tips to Become an AI Coding Commander

After two months of using Alibaba’s Qoder AI coding platform, the author explains why it beats alternatives on cost, compliance and maturity, debunks common myths, shares eight hands‑on best‑practice tips, and presents three real‑world case studies that show its impact on backend and frontend development.

AI codingAgent modeQoder
0 likes · 16 min read
Hands‑On Review of Alibaba Qoder: 8 Practical Tips to Become an AI Coding Commander
大转转FE
大转转FE
Dec 4, 2025 · Frontend Development

From Selenium to AI Agents: How Browser Automation Is Evolving in 2025

This article traces the 20‑year evolution of browser automation—from Selenium’s early scripts to modern AI‑driven agents—highlighting the limitations of each generation, the breakthroughs introduced by Puppeteer, Playwright, and the emerging AI Browser Use, and what the next three years may hold for developers.

PlaywrightSeleniumbrowser automation
0 likes · 10 min read
From Selenium to AI Agents: How Browser Automation Is Evolving in 2025
Top Architect
Top Architect
Dec 3, 2025 · Fundamentals

Boost Your Coding Efficiency with an AI-Powered Naming Tool for Frontend and Backend

This article explains how developers struggling with inconsistent and unclear naming in Java and Vue projects can use a self‑built AI naming assistant—available as a lightweight web app and an IntelliJ IDEA plugin—to instantly generate clean, convention‑compliant identifiers from simple Chinese descriptions.

AIDeveloper Toolsfrontend
0 likes · 6 min read
Boost Your Coding Efficiency with an AI-Powered Naming Tool for Frontend and Backend
ITPUB
ITPUB
Dec 2, 2025 · Frontend Development

Why Do Some Emojis Count as Multiple Characters in JavaScript?

When debugging a web app, the author discovered that certain emojis occupy more than one character slot in JavaScript strings, revealing that emoji length varies because they are composed of multiple Unicode code points such as variation selectors and zero‑width joiners.

EmojiJavaScriptUnicode
0 likes · 4 min read
Why Do Some Emojis Count as Multiple Characters in JavaScript?
php Courses
php Courses
Dec 1, 2025 · Frontend Development

How to Accurately Calculate and Display Pagination Indexes in JavaScript

This guide explains common pagination index problems in web apps and provides a step‑by‑step JavaScript solution—including a reusable function, a full HTML component, handling of empty and dynamic data sets, best‑practice tips, and complete code examples—for seamless user navigation.

Index CalculationJavaScriptWeb Development
0 likes · 8 min read
How to Accurately Calculate and Display Pagination Indexes in JavaScript
Code Wrench
Code Wrench
Nov 29, 2025 · Frontend Development

Building a Modern Desktop Chat App with Wails: Go + Vue Made Easy

This article walks through creating a lightweight, cross‑platform desktop chat application using Wails, demonstrating project structure, Go‑to‑frontend API generation, real‑time event communication, SQLite storage, UI implementation with Vue3, image handling, a one‑click dev script, and packaging size advantages.

GoSQLiteVue
0 likes · 10 min read
Building a Modern Desktop Chat App with Wails: Go + Vue Made Easy
JavaScript
JavaScript
Nov 28, 2025 · Frontend Development

Replace Media Queries with CSS clamp() for Fluid Responsive Design

This article explains why the traditional px unit and media‑query‑heavy approaches struggle on diverse devices and shows how the modern CSS clamp() function can create fluid typography and layout sizes that smoothly adapt from small to ultra‑wide screens without breakpoint jumps.

Fluid Typographyclampcss
0 likes · 5 min read
Replace Media Queries with CSS clamp() for Fluid Responsive Design
vivo Internet Technology
vivo Internet Technology
Nov 26, 2025 · Frontend Development

How to Build a Dynamic Typewriter Effect for AI Search with Vue

This article walks through the evolution of a typewriter‑style text animation for AI‑driven search results, from a simple pure‑text implementation using setInterval to a sophisticated Vue component that handles markdown, embedded cards, escape characters, variable typing speed, and DOM diffing to deliver a smooth, interactive user experience.

AI SearchVuedynamic rendering
0 likes · 15 min read
How to Build a Dynamic Typewriter Effect for AI Search with Vue
Top Architect
Top Architect
Nov 25, 2025 · Backend Development

Why a Username of "null" Can Crash Your System – and How to Prevent It

Using the literal string "null" as a username can silently bypass null checks, create phantom users, pollute databases, and cause debugging nightmares, so this article explains the pitfalls, shows real‑world examples, and provides concrete backend, frontend, and database validation techniques to avoid such bugs.

NULLbackendfrontend
0 likes · 6 min read
Why a Username of "null" Can Crash Your System – and How to Prevent It
JavaScript
JavaScript
Nov 25, 2025 · Fundamentals

Why === Isn’t Enough: Mastering Precise Equality with Object.is() in JavaScript

While the strict equality operator (===) works well for most cases, it fails with special values like NaN and distinguishes +0 and -0 incorrectly; JavaScript’s Object.is() method provides a more precise same‑value equality, correctly handling these edge cases and improving comparisons in Maps, Sets, and other structures.

+0 -0JavaScriptNaN
0 likes · 5 min read
Why === Isn’t Enough: Mastering Precise Equality with Object.is() in JavaScript
Alipay Experience Technology
Alipay Experience Technology
Nov 24, 2025 · Frontend Development

What’s New in Ant Design 6.0? A Deep Dive into the Latest Frontend Upgrade

Ant Design 6.0 and Ant Design X 2.0 were officially released at SEE Conf 2025, introducing smooth migration from v5, raising the minimum React version to 18, adopting pure CSS‑Variables, enabling React Compiler in the build, revamping component semantics, dropping IE support, and adding several new components such as Masonry, enhanced Tooltip, spinner‑style InputNumber, draggable Drawer, and blur‑mask overlays, with a clear upgrade guide and future roadmap.

Ant DesignComponent LibraryReAct
0 likes · 10 min read
What’s New in Ant Design 6.0? A Deep Dive into the Latest Frontend Upgrade
Goodme Frontend Team
Goodme Frontend Team
Nov 24, 2025 · Frontend Development

How React Fiber Eliminates UI Jank: A Step‑by‑Step Deep Dive

This article explains why web pages feel sluggish, how React Fiber’s interruptible asynchronous rendering solves the jank problem, and walks through progressively refined implementations—from a basic React demo to a full Fiber renderer with work‑loop scheduling, diffing, and performance optimizations.

Diff AlgorithmJavaScriptReAct
0 likes · 19 min read
How React Fiber Eliminates UI Jank: A Step‑by‑Step Deep Dive
21CTO
21CTO
Nov 20, 2025 · Frontend Development

New Front‑End Tools: Nuxt MCP Server, Next.js Deployment Boost, and Fresh UI Libraries

This roundup highlights recent front‑end developments, including Nuxt’s open‑source MCP server for native UI rendering, Next.js’s adapter API that simplifies non‑Vercel deployments, Bitrise’s report on soaring React Native usage, plus two new open‑source UI libraries—Wiggle UI and Poopetti.

BitriseNext.jsNuxt
0 likes · 8 min read
New Front‑End Tools: Nuxt MCP Server, Next.js Deployment Boost, and Fresh UI Libraries
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 20, 2025 · Frontend Development

Build a Galactic Hero Section with Three.js: From Starfield to Shaders

This article walks you through creating a visually striking hero section using Three.js, covering prerequisite knowledge, scene composition, nebula background, particle‑based star rings, custom GLSL shaders for animation, planet rendering with displacement maps, and performance‑boosting techniques like anisotropic filtering.

3D graphicsGLSLShader
0 likes · 19 min read
Build a Galactic Hero Section with Three.js: From Starfield to Shaders
Instant Consumer Technology Team
Instant Consumer Technology Team
Nov 17, 2025 · Frontend Development

How AI and Visual Builders Are Transforming Frontend Efficiency and UX

This edition of the Frontend Tech Weekly explores the convergence of efficiency, intelligence, and experience through case studies on TurboUIBuilder’s native visual page construction, deep Android crash‑attribution optimization, AI‑powered coding agents like Coding and Cursor, multimodal recommendation advances, MCP standards, and a curated selection of open‑source projects.

AIfrontendopen-source
0 likes · 9 min read
How AI and Visual Builders Are Transforming Frontend Efficiency and UX
JavaScript
JavaScript
Nov 17, 2025 · Frontend Development

Why vw and clamp() Are Replacing px/rem for Fluid Layouts

The article explains how modern CSS is shifting from fixed pixel and rem units to viewport‑width (vw) and the clamp() function, offering truly fluid layouts that scale smoothly across any screen size while addressing the boundary issues of vw alone.

VWclampcss
0 likes · 5 min read
Why vw and clamp() Are Replacing px/rem for Fluid Layouts
Code Mala Tang
Code Mala Tang
Nov 16, 2025 · Frontend Development

How to Build a Robust Speech‑to‑Text Feature in React with Tencent ASR

This article walks through the complete front‑end architecture and implementation details for integrating Tencent Cloud speech‑to‑text into a React app, covering token authentication, SDK initialization, event handling, cursor‑aware text insertion, character limits, permission handling, error management, and state management with MobX.

MobXReActTencent Cloud
0 likes · 11 min read
How to Build a Robust Speech‑to‑Text Feature in React with Tencent ASR
Java Captain
Java Captain
Nov 16, 2025 · Fundamentals

Boost Your Code Naming with an AI‑Powered Naming Assistant for Vue and Java

The article shares the author’s struggle with inconsistent naming in front‑end Vue and back‑end Java code and introduces a self‑built AI‑driven naming tool—available as a lightweight web app and an IntelliJ IDEA plugin—that instantly generates clean, convention‑compliant identifiers.

AIIDEA PluginTool
0 likes · 5 min read
Boost Your Code Naming with an AI‑Powered Naming Assistant for Vue and Java
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 12, 2025 · Frontend Development

What’s New in enum-plus v3.0? Simplify Enum Initialization and Explore the New Plugin System

enum-plus v3.0 introduces a milestone set of features—including removal of the as const assertion, new enum.named and enum.meta properties, revamped enum.values behavior, additional helper methods, a global configuration API, and a modular plugin ecosystem—while also detailing breaking changes and bug fixes for developers.

EnumLibraryPlugin
0 likes · 8 min read
What’s New in enum-plus v3.0? Simplify Enum Initialization and Explore the New Plugin System
Instant Consumer Technology Team
Instant Consumer Technology Team
Nov 10, 2025 · Artificial Intelligence

How AI is Transforming Frontend Development: New Tools, Practices, and Insights

This issue of the tech weekly explores the latest breakthroughs where AI meets frontend development, highlighting the launch of the Vike framework, AI-driven code testing and debugging workflows, large-model innovations from major companies, open-source AI CRM and model projects, and practical insights for developers and engineers.

AIcode generationfrontend
0 likes · 8 min read
How AI is Transforming Frontend Development: New Tools, Practices, and Insights
FunTester
FunTester
Nov 10, 2025 · Frontend Development

Why Custom Events Are the Secret to Cleaner Front‑End Code

Custom events let developers decouple UI components by broadcasting semantic actions, offering a flexible alternative to direct calls or global state, and improving maintainability, testability, and performance, with best‑practice naming, payload design, bubbling, and cancelable options explained alongside practical JavaScript examples.

Event-Driven Architecturecustom eventsdecoupling
0 likes · 10 min read
Why Custom Events Are the Secret to Cleaner Front‑End Code
FunTester
FunTester
Nov 7, 2025 · Frontend Development

Prevent Memory Leaks and Master Event Handling in JavaScript

This article explains how forgetting to remove event listeners can cause memory leaks, demonstrates proper listener cleanup, addresses closure pitfalls in loops, introduces event delegation, and provides practical debounce, throttle, naming conventions, and debugging techniques for robust frontend development.

Throttledebounceevent delegation
0 likes · 16 min read
Prevent Memory Leaks and Master Event Handling in JavaScript
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 4, 2025 · Frontend Development

How React Compiler Ends Four Years of Manual Optimization

This article reviews recent React developments—including the React 19.2 release, new Activity and useEffectEvent APIs, the stable 1.0 release of babel‑plugin‑react‑compiler—and explains how automatic compiler‑based optimizations replace manual memo, useCallback, and useMemo patterns, while also covering KeepAlive challenges and code examples.

ReActReact Compilerfrontend
0 likes · 9 min read
How React Compiler Ends Four Years of Manual Optimization
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 3, 2025 · Frontend Development

Boost Frontend Productivity with These Must‑Use MCP Tools

This article reviews practical Model‑Chat Plugins (MCP) that front‑end developers can integrate into their workflow—covering Figma, Apifox, Context7, and Chrome DevTools MCPs—explaining setup steps, code examples, and how they dramatically improve efficiency and code maintainability.

AI‑assisted developmentApifoxChrome DevTools
0 likes · 8 min read
Boost Frontend Productivity with These Must‑Use MCP Tools
Nightwalker Tech
Nightwalker Tech
Nov 3, 2025 · Artificial Intelligence

Boost Your Development with Spec Kit: The AI‑Powered Specification‑Driven Toolkit

Spec Kit is an AI‑native specification‑driven development toolkit that treats structured natural‑language specs as the single source of truth, providing end‑to‑end traceability, AI‑native collaboration, and automated code generation to accelerate project setup, planning, and implementation.

AI programmingAutomationSpecification‑Driven Development
0 likes · 12 min read
Boost Your Development with Spec Kit: The AI‑Powered Specification‑Driven Toolkit
Code Mala Tang
Code Mala Tang
Nov 1, 2025 · Frontend Development

Unlock JavaScript’s Static Initialization Blocks: Boost Your Custom Elements

This article explains JavaScript static initialization blocks, shows how they simplify shared resources and custom element setup, provides practical code examples, discusses benefits, browser compatibility issues, and offers guidance on when and how to use them effectively.

JavaScriptWeb Developmentcustom elements
0 likes · 6 min read
Unlock JavaScript’s Static Initialization Blocks: Boost Your Custom Elements
Java Tech Enthusiast
Java Tech Enthusiast
Oct 30, 2025 · Frontend Development

Why Front‑End Development Is Actually Harder Than You Think

The article explores the hidden complexities of front‑end work—ranging from HTML, CSS, and JavaScript to modern frameworks, build tools, TypeScript, and UI polish—while contrasting them with back‑end challenges like concurrency, scaling, and system architecture, revealing why both sides are equally demanding for developers.

Web Developmentbackendfrontend
0 likes · 6 min read
Why Front‑End Development Is Actually Harder Than You Think
Huawei Cloud Developer Alliance
Huawei Cloud Developer Alliance
Oct 30, 2025 · Frontend Development

Why Next.js Is the Go‑To Framework for High‑Performance Modern Web Apps

Next.js, a React‑based frontend framework, combines SPA and MPA advantages through hybrid rendering, offering automatic file‑system routing, flexible SSR/SSG/CSR/ISR strategies, built‑in API routes, image optimization, middleware and edge computing, making it ideal for e‑commerce, CMS, enterprise dashboards and SEO‑critical sites.

ReActSSRfrontend
0 likes · 8 min read
Why Next.js Is the Go‑To Framework for High‑Performance Modern Web Apps
Eric Tech Circle
Eric Tech Circle
Oct 30, 2025 · Frontend Development

How to Slash Mini Program Package Size with Smart Sub‑Package Strategies

This article explains why WeChat Mini Programs hit the 2 MB package limit, analyzes common causes of oversized main bundles, and provides a step‑by‑step guide—including pre‑slimming tactics, subpackage configuration, code examples, and performance tips—to reduce the main package below the limit and improve load speed.

Package SizePerformance OptimizationSubpackage
0 likes · 12 min read
How to Slash Mini Program Package Size with Smart Sub‑Package Strategies
Code Mala Tang
Code Mala Tang
Oct 27, 2025 · Frontend Development

Master Fabric.js: Build Interactive Canvas with Zoom, Snap, and Guides

This article walks through setting up Fabric.js on a web page, creating a canvas, drawing rectangles, adding zoom and pan controls, implementing object snapping and alignment guides, and provides complete source code so readers can quickly build an interactive canvas application.

CanvasFabric.jsJavaScript
0 likes · 21 min read
Master Fabric.js: Build Interactive Canvas with Zoom, Snap, and Guides
JavaScript
JavaScript
Oct 20, 2025 · Frontend Development

How to Detect When Users Leave a Web Page and Send Reliable Data

This article explains various browser scenarios that indicate a user has left a page, compares the Page Visibility API, beforeunload/unload events, navigator.sendBeacon, and pagehide/pageshow handling, and provides practical code examples and recommendations for reliable detection and data reporting.

beforeunloadfrontendpage-visibility
0 likes · 10 min read
How to Detect When Users Leave a Web Page and Send Reliable Data
IT Services Circle
IT Services Circle
Oct 19, 2025 · Frontend Development

How CSS text‑autospace Fixes Chinese‑English Mixed Typography

This article explains how the new CSS text‑autospace property automatically inserts proper spacing between Chinese characters and Latin letters or numbers, improving readability of mixed‑language web content and offering a simple, standards‑based solution with broad browser support.

CJKTypographyWeb Development
0 likes · 5 min read
How CSS text‑autospace Fixes Chinese‑English Mixed Typography
JavaScript
JavaScript
Oct 17, 2025 · Frontend Development

Why IndexedDB Is the Modern Frontend Storage Powerhouse Over localStorage

While localStorage has long been the default client‑side storage for web apps, its security risks, synchronous blocking, limited capacity, and lack of advanced querying make it unsuitable for modern applications, and IndexedDB emerges as a superior, asynchronous, high‑capacity, secure, and query‑rich alternative, especially when paired with helper libraries like idb, Dexie.js, and localForage.

IndexedDBJavaScriptWeb Performance
0 likes · 5 min read
Why IndexedDB Is the Modern Frontend Storage Powerhouse Over localStorage
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 16, 2025 · Frontend Development

Build a Powerful, Zero‑Dependency HTTP Library with Abort, Cache, Retry, and SSE Support

This article walks through creating a lightweight, framework‑agnostic HTTP request library that extends fetch with features such as request cancellation, automatic caching, retry logic, concurrent control, progress tracking, and intelligent Server‑Sent Events parsing, complete with TypeScript interfaces, CLI scaffolding, and comprehensive testing.

HTTPLibrarySSE
0 likes · 23 min read
Build a Powerful, Zero‑Dependency HTTP Library with Abort, Cache, Retry, and SSE Support
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 14, 2025 · Frontend Development

Boost Frontend Internationalization 80% Faster with fe-js-utils CLI

This article introduces fe-js-utils, a highly configurable JavaScript CLI tool that automates the extraction of hard‑coded Chinese strings, generates common and module‑specific locale files, intelligently classifies text, and replaces literals, dramatically accelerating internationalization workflows for front‑end projects.

AutomationCLI toolInternationalization
0 likes · 23 min read
Boost Frontend Internationalization 80% Faster with fe-js-utils CLI
Instant Consumer Technology Team
Instant Consumer Technology Team
Oct 13, 2025 · Artificial Intelligence

Explore Vue Vapor Mode, Next.js 16, AI‑Native Apps, and Cutting‑Edge Tech Trends

This edition of the tech weekly spotlights the evolution of front‑end frameworks with Vue 3.6’s experimental Vapor Mode and Next.js 16 Beta, delves into Alibaba’s AI‑native application architecture, shares iOS app size‑reduction tactics from Huolala, and highlights open‑source breakthroughs such as JD’s xLLM, Xiaomi’s audio model, and the Sherpa‑onnx speech engine.

AIMobile OptimizationNext.js
0 likes · 6 min read
Explore Vue Vapor Mode, Next.js 16, AI‑Native Apps, and Cutting‑Edge Tech Trends
IT Services Circle
IT Services Circle
Oct 13, 2025 · Frontend Development

React Goes Independent: New Foundation, Compiler 1.0, and React 19.2 Highlights

At React Conf 2025 the team announced the creation of the independent React Foundation under the Linux Foundation, launched the stable React Compiler 1.0 to automate performance optimizations, and released React 19.2 with new APIs and tighter integration, signaling a community‑driven future for the library.

ReActReact 19.2React Compiler
0 likes · 5 min read
React Goes Independent: New Foundation, Compiler 1.0, and React 19.2 Highlights
21CTO
21CTO
Oct 12, 2025 · Frontend Development

Are Native Browser APIs Replacing Front‑End Frameworks?

The article argues that modern browsers now provide powerful native alternatives for routing, state management, and components, reducing the need for frameworks like React, Vue, and Angular, and explains how emerging standards are reshaping front‑end development, performance, and developer ergonomics.

Browser APIsJavaScriptframeworks
0 likes · 11 min read
Are Native Browser APIs Replacing Front‑End Frameworks?
JavaScript
JavaScript
Oct 12, 2025 · Frontend Development

How to Stop Double‑Click Mishaps: Proven Front‑End Strategies

This article explains why buttons are often clicked repeatedly in web apps, outlines common causes such as user habits, network latency, and bugs, and presents several practical front‑end solutions—including disabling the button, using a flag, CSS tricks, and backend idempotency checks—to prevent duplicate submissions and improve user experience.

buttondebouncedouble-click
0 likes · 7 min read
How to Stop Double‑Click Mishaps: Proven Front‑End Strategies
macrozheng
macrozheng
Oct 10, 2025 · Frontend Development

Master Business Flowchart Design with LogicFlow: A Powerful Open‑Source Front‑End Framework

LogicFlow, an open‑source TypeScript‑based flowchart editor from Didi, offers high customizability, rich interactions, plugin extensions, and a browser‑side execution engine, enabling developers to quickly integrate diverse diagram types—such as flowcharts, mind maps, ER and UML—into business applications, with simple npm installation and comprehensive examples.

FlowchartLogicFlowTypeScript
0 likes · 6 min read
Master Business Flowchart Design with LogicFlow: A Powerful Open‑Source Front‑End Framework
JavaScript
JavaScript
Oct 7, 2025 · Frontend Development

Master Fluid Typography with CSS clamp(): Ditch Media Queries

This article explains why the traditional px unit struggles on varied screens, introduces the CSS clamp() function, and demonstrates how to use it for fluid typography and adaptable layout widths, eliminating complex media queries and achieving smooth, responsive designs across devices.

Fluid TypographyWeb Developmentclamp
0 likes · 5 min read
Master Fluid Typography with CSS clamp(): Ditch Media Queries
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 7, 2025 · Frontend Development

20 Must-Have VS Code Extensions to Boost Your Productivity

Discover 20 carefully selected VS Code extensions that enhance productivity across coding, reading, project management, and debugging, offering features such as in-editor novel readers, real-time financial trackers, JSON visualizers, workspace color themes, automatic file history, and code spell checking for developers of all levels.

ExtensionsVS Codedevelopment tools
0 likes · 13 min read
20 Must-Have VS Code Extensions to Boost Your Productivity
JavaScript
JavaScript
Oct 5, 2025 · Frontend Development

How to Auto-Detect Frontend Updates and Prompt Users to Refresh

This article explains why front‑end applications need automatic version detection, compares polling, Server‑Sent Events and WebSockets, and offers practical implementation tips and UX guidelines for prompting users to refresh to the latest release.

PollingSSEauto‑update
0 likes · 7 min read
How to Auto-Detect Frontend Updates and Prompt Users to Refresh