This article explores the evolution of browsers, the layered architecture of front‑end development, the role of standardization bodies, and how understanding browser internals—from multi‑process models to JavaScript engines—helps developers write more efficient, compatible, and future‑proof web applications.
The December TC39 meeting updated several proposals—including moving Intl.Segmenter to Stage 1 as V2, adding new timeZoneName values, expanding Intl.DisplayNames, introducing Array.prototype.groupBy and Array.fromAsync, and refining RegExp modifiers and buffer boundaries—while outlining the criteria for advancing proposals through the stages.
This guide shows how to generate smooth, high‑quality curves from a polyline in pure JavaScript by computing quadratic and cubic Bézier points, deriving control points via angle‑bisector geometry, assembling the segments, and rendering and animating the result on an HTML5 canvas without external libraries.
Canvas performance hinges on the number and size of drawn shapes, so optimizing by reducing draw‑calls, using layered or clipped rendering, and offloading heavy drawing to OffscreenCanvas or Web Workers can preserve frame rates and keep the UI responsive.
This article presents twenty concise JavaScript one‑liner snippets that boost front‑end productivity, covering tasks such as retrieving cookies, converting RGB to hex, copying to clipboard, validating dates, calculating day differences, manipulating strings, arrays, and detecting dark mode, each illustrated with ready‑to‑use code examples.
Node.js 12.22.8 (code‑named “Er”) has been released, featuring a c‑ares update to fix underscore CNAME resolution, updated Mozilla NSS root certificates, and a series of additional commits ranging from build and dependency upgrades to bug fixes across various modules.
This article explains React's event system, covering how onClick events are delegated to the document, processed through synthetic events, and handled via the fiber architecture, plugin registry, and priority-based dispatching in React 16.13.1.
This article provides a step‑by‑step tutorial on how to use html2canvas to screenshot Baidu Maps (both v3.0 and GL v1.0), handle cross‑origin image issues, adjust SVG overlay positions, and download the resulting images using canvas or base64 data URIs.
Optimizing HTML5 canvas performance involves reducing draw calls, using layered and clipped rendering, performing quick bounding‑box checks, and offloading heavy drawing to OffscreenCanvas with Web Workers, enabling smooth animation even when thousands of shapes are rendered.
This article explains how to build a lightweight virtual DOM library in JavaScript, covering the creation of VNode objects, the patch and diff algorithms, handling of attributes, classes, styles, and events, and demonstrates a step‑by‑step implementation using the Snabbdom approach.
This tutorial shows how to import the required OpenLayers modules into a Vue project, configure a map, add a Polygon draw interaction, handle the drawend event to compute and format the polygon's area using OpenLayers' getArea function, and provides a complete working example with code.
This guide shows how to load a GeoServer TileWMS layer in a Vue app with OpenLayers, configure map and line layers, add a selectable draw interaction for LineString geometry, capture drawn coordinates, and provides a complete Vue component example.
This tutorial walks through importing OpenLayers modules into a Vue component, defining line coordinates, creating vector sources and layers, styling the line, and integrating the line layer with other map layers to render a green polyline on the map.
This article explains Vue 3's Composition API, covering how to create reactive data with ref and reactive, use toRefs, define computed properties, apply readonly, watch and watchEffect, handle lifecycle hooks, pass props, and share state via provide and inject, all with practical code examples.
This article walks through building a Vue 3‑style reactivity system from scratch, covering effect functions, dependency collection with Set/Map/WeakMap, automatic tracking via Proxy, and the implementation of reactive and ref utilities, all illustrated with complete JavaScript code examples.
Markdeep is an open‑source JavaScript plugin that turns any plain‑text file into a fully rendered Markdown document with support for tables, LaTeX equations, charts and even PPT‑style slides, requiring only a single markup line and no additional installations.
This article details Laiye Technology’s AI R&D team’s end‑to‑end approach to designing and optimizing a custom entity‑relationship annotation tool, covering data‑labeling challenges, shortcomings of Excel and off‑the‑shelf solutions, architectural requirements, line‑breaking and mark‑position algorithms, performance improvements, and real‑world results.
This guide explains how to initialize JavaScript arrays with primitive values, shared object references, and distinct object instances using methods like Array.fill, Array.from, and map, highlighting pitfalls of shared references and offering practical code examples for each approach.
This article introduces the importance of frontend unit testing, presents survey data on current practices, compares popular frameworks like Jest and Mocha, provides step‑by‑step setup instructions, demonstrates code examples for JavaScript, TypeScript and async functions, and explains how to generate coverage reports and use common assertions.
This article walks through the process of creating both simple and advanced UI animations in an e‑commerce setting using imgcook, covering animation decomposition, state handling, transition delays, keyframe usage via Element.animate, and practical tips for avoiding repeated triggers.
This article introduces the use-gesture library, a lightweight React and vanilla JavaScript tool for enriching mouse and touch interactions, explains installation via Yarn or npm, demonstrates various gesture hooks with code examples, and showcases visual effects through animated demos.
This article introduces a pure‑frontend approach to Web AR using AR.js, explains core technologies like WebRTC, JSARToolKit, A‑Frame, and Three.js, guides through HTTPS setup, demonstrates image‑tracking and video examples, and shows how to integrate Agora video calls for remote cat‑watching.
This article explains the concept of Native‑ESM, traces the evolution of JavaScript module systems from IIFE to ES Modules, and shows how Vite leverages native ES modules, ESBuild, and caching to achieve dramatically faster cold starts and hot updates compared to traditional bundlers like Webpack.
This article explores the implementation of @mention functionality in modern front‑end rich‑text editors, covering background, industry examples from Weibo and Twitter, core concepts like Range and Selection APIs, cursor handling, search pop‑ups, key interception, and techniques for inserting custom @tags with code snippets.
This tutorial explains how to create a Chrome extension that injects JavaScript into Juejin pages to load a Live2D cat model, covering manifest configuration, script injection, canvas setup, optional real‑time chat integration, and step‑by‑step installation instructions.
The article introduces the vscode‑cats VSCode extension that embeds a Live2D cat into the editor, explains its motivation, installation steps, configuration options, core implementation using HTML and TypeScript, and provides troubleshooting tips for checksum warnings, offering a practical guide for developers.
This article explains how the JavaScript with statement creates a new lexical scope that can unintentionally create global variables, cause data leakage, and dramatically degrade performance, while also covering LHS/RHS lookup, execution contexts, variable/activation objects, and scope chain mechanics.
Konva.js detects whether a point lies inside a shape by assigning each shape a unique random color key, rendering a hidden hitCanvas with these colors, and then reading the pixel color at the click position to identify the corresponding shape, supporting up to 16.7 million objects.
This tutorial walks you through creating a full‑stack word‑cloud web application using Flask for the backend and Vue for the frontend, covering environment setup, project structure, dependency installation, core code snippets, and how to run and package the app.
This article explains how the V8 JavaScript engine allocates memory, why garbage collection is necessary, describes the memory layout of new and old generations, reviews common GC algorithms such as reference counting, mark‑sweep, mark‑compact and incremental marking, and offers practical tips for writing high‑performance JavaScript code.
Learn three JavaScript approaches—using map with join, map with manual concatenation, and reduce—to extract a specified property from each object in a JSON array and combine the values into a comma-separated string, with full code examples.
This article demonstrates how to refactor tangled asynchronous request chains and complex if‑else logic in JavaScript by replacing callback hell with Promise.all and async/await, extracting pure helper functions, and applying best‑practice principles to improve readability, testability, and maintainability.
This article explains how to build a QR‑code based login system by designing a token table, defining roles, creating two REST APIs (generate QR code and confirm identity), and integrating front‑end JavaScript with a Spring Boot WebSocket server, complete with full code examples and step‑by‑step instructions.
This document details the EE NEXT SDK team's technical decisions to adopt Web Components for front‑end component development, explains the benefits and drawbacks of Custom Elements and Shadow DOM, outlines challenges such as cross‑stack compatibility, bundle size, style isolation, and provides practical implementation guidance and best‑practice recommendations.
This article details the end‑to‑end development of Douyin's National Day mini‑game, covering the Lynx + Cocos tech stack, core Cocos concepts such as ECS, node hierarchy, lifecycle, a step‑by‑step walkthrough of the star‑catcher demo code, background looping strategies, checkpoint transitions, character Spine animation, resource loading pipelines, custom bitmap fonts, and a series of performance optimizations for mobile deployment.
The article outlines Microsoft’s TypeScript 4.5 release with its new type‑system features and performance fixes, then shifts to Google’s unveiling of the Fuchsia OS, its microkernel architecture, and growing speculation that Android 12 could be the final Android update.
This guide walks through extracting and reproducing the encrypted parameters required to post chat messages on Laifeng live streams, covering site navigation, packet capture, timestamp generation, signature calculation via JavaScript decryption, and a complete Python script that logs in, builds the request, and sends the comment.
This article reviews the most suitable programming languages for artificial intelligence, explaining why Python, R, Java, LISP, Prolog, C++, Haskell, JavaScript, and Julia excel in AI development and outlining their key advantages and typical applications.
This guide explains how to create a WeChat chatbot using the open‑source Wechaty SDK, covering required npm packages, QR code login, bot initialization, message sending, and important considerations such as Node.js version and npm mirror configuration.
Despite the rise of newer frameworks like React and Next.js, jQuery remains a dominant JavaScript library with a 78% market share, deeply embedded in platforms such as WordPress, and continues to evolve through updates to its core and UI components while facing performance debates.
This article explains what ESLint is, walks through its installation and basic configuration, dives into detailed rule, parser, and plugin settings, describes its AST‑based analysis process, and shows how to integrate it with tools like VSCode, Prettier, Husky and lint‑staged for robust JavaScript code quality enforcement.
Rust, a fast and memory‑efficient language adopted by major tech firms, is increasingly replacing JavaScript in web tooling such as bundlers, compilers, and linters, with projects like SWC, Deno, and WebAssembly demonstrating its performance, safety, and growing ecosystem for the future of JavaScript infrastructure.
This article explores the surprising 13KB JavaScript game "Space Huggers," explains the JS13k competition rules, and shares practical techniques—pixel graphics, minimalist sound, lightweight engines, and code trimming—that developers can use to create ultra‑small yet functional browser games.
This article explains the fundamentals of state and strategy patterns, introduces XState as a true finite‑state‑machine library, compares it with Redux/Vuex, discusses its advantages and drawbacks, and provides practical code examples for plain JavaScript, React, Vue 3 and Promise integration.
This article introduces RxJS, explains the prerequisite concepts of reactive programming, streams, observer and iterator patterns, and then details core RxJS constructs such as Observable, Observer, Subscription, and Subject with code examples and visual illustrations.
This article introduces six intriguing open‑source projects—including an audio‑based keylogger, a high‑accuracy face‑recognition library, a TensorFlow.js video‑person removal tool, a Chinese kinship calculator, a Java Word template engine, and a sleek macOS Markdown editor—each with brief descriptions, screenshots, and usage examples.
This article reviews recent TC39 proposals that have reached Stage 4—including Intl.Segmenter, Error Cause, Intl.DurationFormat, Array.groupBy, Destructuring Private Fields, String.cooked, RegExp modifiers, RegExp \R, buffer boundaries, Evaluator Attributes, and Bind‑this—explaining their goals, usage, and providing practical JavaScript code examples.
A SlashData survey of over 19,000 developers reveals JavaScript as the most widely used language, highlights rapid growth for Python, Rust, and PHP, and examines regional 5G involvement and salary‑driven job‑change motivations across the global developer community.
This article explains the need for JavaScript modularization, compares major module standards such as CommonJS, AMD, CMD, UMD and ES Modules, and traces their historical evolution, highlighting benefits, drawbacks, and practical usage examples for modern front‑end development.
This article introduces WebTorrent, an open‑source JavaScript library that brings BitTorrent‑style peer‑to‑peer file sharing and streaming directly to browsers using WebRTC, explains its advantages over traditional download tools, and provides step‑by‑step code examples for both web and Node environments.
This guide walks you through using Postman to automate API testing, covering result validation, batch execution, variable handling, environment management, and dependency resolution with practical JavaScript snippets and step‑by‑step instructions.
This article examines jQuery’s historic rise, its deep integration in platforms like WordPress, the reasons it survived the shift to modern frameworks such as React, Angular and Vue, and why it may still be a useful tool despite declining popularity.
This article introduces the five major new features of ES2021, including numeric separators, String.prototype.replaceAll(), Promise.any, logical assignment operators, and WeakRefs, with detailed explanations and code examples.
This article explains the concept of JavaScript sandboxing, outlines common use cases, walks through several implementation strategies—from simple eval wrappers to with‑Proxy‑iframe combos—and discusses sandbox escape techniques and how to mitigate them, providing practical code examples throughout.
By leveraging pixel color and alpha values, this guide explains how to determine whether a user click falls inside a Canvas shape, compares it with traditional methods like crossing number and winding number, and provides a practical implementation using Create.js with sample code.
This article provides a collection of practical JavaScript snippets covering cookie handling, color conversion, clipboard operations, date validation, string manipulation, array utilities, URL query extraction, time formatting, and dark‑mode detection, all useful for front‑end developers.
This article explains the concept of requestIdleCallback, its limitations, and how React Fiber implements a custom idle‑time scheduler using requestAnimationFrame and MessageChannel, complete with code demos and analysis of the underlying React source.
This tutorial walks through creating a 3D login page using Vue 3 and three.js, covering scene setup, lighting, camera configuration, renderer initialization, animation loops, and additional effects such as an orbiting earth, star field, and moving clouds.
The article explains that while a Vue root instance can define its data as an object or a function, a component's data must be a function to avoid shared memory between instances, illustrating the issue with code examples and detailing Vue's option‑merge validation.
This tutorial walks through redesigning a complex role‑relationship page using PIXIJS for 2D rendering, custom GLSL shaders for cloud effects, TWEENJS for smooth animations, and careful performance tuning to ensure responsive behavior across devices.
This article explains QR code fundamentals, including its advantages, structural components, error‑correction levels, design principles, generation workflow, JavaScript implementation details, and extensions such as artistic QR codes and mini‑program codes, providing practical examples and visual illustrations.
This article explains how to replace a heavy 78 KB GIF loading animation with the lightweight Fancy-Components wave‑filter web component, covering its installation, configuration, and usage in plain HTML, React, Vue 2, Vue 3, Vue‑CLI, Vite, and custom attribute options such as color, duration, amplitude, delay, mode, and interval.
This course introduces AJAX (Asynchronous JavaScript and XML), explaining how it enables browsers to fetch data without page refresh by sending asynchronous requests, and clarifies that AJAX is a technique combining existing web standards rather than a new programming language.
This article examines the limitations of the original DVA framework, proposes a mini‑async‑dva fork that adds async/await support to model effects, and details its implementation—including store management, dynamic model registration, and asynchronous component loading—while providing full code comparisons.
This article explains why React introduced Hooks, compares the official Hooks with popular third‑party libraries ahooks and react‑use, lists their most useful Hooks, shows how to install them, and provides a custom Hook example for displaying error modals, helping developers write cleaner, more reusable functional components.
This article provides a comprehensive overview of Redux, covering its design philosophy, core components, API implementation, React bindings, and practical code examples to help developers understand and apply state management effectively in modern front‑end applications.
The article explains how integrating Source Maps—generated by modern bundlers and automatically uploaded via a Webpack plugin—into iQIYI Hawkeye’s front‑end exception monitoring restores original file names and line numbers for minified production JavaScript errors, enabling rapid debugging despite bundle‑size and versioning challenges.
This article explains the evolution of JavaScript module standards—from early CommonJS and AMD/UMD approaches to the native ES modules (ESM)—and shows how bundlers, browsers, and tooling work together to manage dependencies, improve code organization, and enable modern web development.
This article explains WebRTC fundamentals, compares it with WebSocket, describes SDP, ICE, STUN/TURN NAT traversal, and provides full server‑side and client‑side JavaScript code to build a peer‑to‑peer video conferencing demo.
This article explains how to use Web Workers to offload heavy IndexedDB log processing, compares copy versus transferable data transfer, demonstrates a Promise‑based Worker wrapper, and outlines the limitations and best practices for improving front‑end performance.
This article explores eight practical techniques for implementing theme switching in web applications—including class toggling, stylesheet swapping, CSS variables, alternate rel links, Less modifyVars, Ant Design/Vant custom themes, Element‑UI dynamic theming, and JSS—detailing code snippets, advantages, and limitations of each approach.
This article walks through creating a lightweight Hongxing Erke‑style e‑commerce mini‑program using WeChat's cloud development, covering tool setup, cloud database design, UI layout, tabBar customization, data loading, pagination, sorting, and detail‑page navigation with practical code examples and common pitfalls.
This article explains the necessity, design principles, and concrete implementation of a full‑chain tracing system for Node.js applications, covering architecture choices, industry solutions, core Async Hooks concepts, the zone‑context framework, invoke‑tree construction, garbage collection, and practical demo code.
This article explores the V8 JavaScript engine’s architecture, from its historical origins and source‑code acquisition to its loading strategies, lexical analysis, parsing, compilation, and execution optimizations, illustrating how V8 achieves high performance in browsers and Node.js.
This article reviews the evolution of JavaScript frameworks over the past three decades, defines what constitutes a framework, explains their core concepts of constraint and support, and analyzes how changing web requirements have driven the development of modern front‑end architectures.
This article introduces RxJS, explains its reactive programming paradigm, core concepts such as Observables, Observers, Subjects, Operators and Schedulers, and demonstrates practical implementations like a draggable ball and toast notifications, providing code examples and best‑practice guidance for front‑end developers.
JavaScript, despite its evolution and flexibility, still retains three outdated features—void operator, with statement, and labels—that remain functional but are inefficient or confusing, and developers are advised to avoid using them in modern code to maintain readability and prevent bugs.
This article explains JavaScript’s event flow, detailing the three phases of capturing, target, and bubbling, demonstrates how to use addEventListener with the useCapture flag, and shows practical techniques for handling, delegating, and stopping event propagation in web applications.
This guide walks developers through DrawIO secondary development, explaining why integration is needed, how to set up Java/Ant, clone and build the source, configure dev mode, deploy via various platforms, and use core APIs like getCurrentFile and loadFile, with a starter scaffold on GitHub.
This article reviews a series of common Node.js utilities—type checking, async sleep, file handling, streams, HTTP requests, assertions, code coverage, debugging, deprecation warnings, source‑maps, child processes, and CLI testing—comparing community packages with built‑in APIs, rating their replaceability, and offering practical migration advice for modern Node.js development.
During the holiday the author introduces Chuncai, an open‑source desktop companion plugin that greets developers, displays messages, and can be customized, then provides the full JavaScript implementation, configuration details, Tuling API integration, and step‑by‑step instructions for embedding it into a web page.
This article clarifies the misconception that JavaScript generators are only for async, explains their underlying pause‑and‑resume mechanism, demonstrates how they can model infinite sequences such as prime numbers by translating Haskell concepts, and shows practical API designs using generators.
This roundup covers the upcoming Nuxt 3 release with performance upgrades, the retirement of layui, interactive front‑end learning games, new zero‑config frameworks like siroc, a faster coloring tool Nano Colors, the unified unplugin system, Tailwind Mobile component library, plus articles on Tubi engineer culture and Rome's migration to Rust.
This article provides a comprehensive step‑by‑step guide for migrating a Vue 2 project built with Vue CLI to Vite, covering project structure analysis, removal of Vue CLI dependencies, configuration changes, handling of environment variables, alias setup, JSX support, asset handling, and additional build optimizations.
The article examines LayUI’s impending shutdown, its simple yet practical design for backend developers, distinctive visual appeal, the paid LayAdmin extension, technical limitations such as its custom module system and mobile support, and speculates on why the project is being discontinued.
The article explains how front‑end developers can prevent duplicate or stale HTTP calls by identifying identical requests with a unique key, then canceling them using Axios’s CancelToken or Fetch’s AbortController—integrated via React hooks, Axios interceptors, and route‑change cleanup.
This article explains what memory leaks are, how to identify them in Vue SPA projects using Chrome's memory tools, lists common leak patterns, and provides practical code‑level solutions—including proper event unbinding, timer cleanup, and correct use of keep‑alive—to keep your application performant.
This comprehensive guide walks you through installing Commander.js, declaring program variables, defining options (including booleans, required, variadic, and default values), creating commands and arguments, customizing help output, using hooks, handling async actions, and advanced parsing configurations for robust Node.js command‑line applications.
This article explains how to create a browser‑based 1‑to‑1 real‑time audio/video communication application using WebRTC APIs, covering media capture, SDP and ICE handling, signaling with socket.io, peer‑to‑peer connection setup, data channels, and NAT traversal techniques.
This article examines why modern frontend developers adopt frameworks, outlines their advantages and drawbacks, and then explores Web Components—custom elements, Shadow DOM, and HTML templates—as native alternatives that could potentially replace framework‑based componentization while preserving performance and compatibility.
This guide outlines ten Vue.js performance optimization techniques—including using stable keys in v‑for, freezing immutable data, defining component data as a function, lazy‑loading components, separating non‑reactive data, employing event delegation, leveraging functional components, and using provide/inject—to boost rendering speed, cut memory usage, and simplify maintenance.
WebAssembly is a portable, low‑size binary format that complements JavaScript by letting C, C++, Rust, and other languages compile to fast‑loading modules, offering near‑native speed, easy macOS setup with Emscripten, measurable performance gains such as a 1.9× speed‑up on recursive Fibonacci, and seamless interaction with JavaScript for compute‑heavy web applications.
Monaco Editor, the browser‑based code editor powering VS Code, originated in 2011 under Erich Gamma’s team, offers a lightweight editor control with rich UI widgets, and Monarch‑based syntax highlighting, and LSP‑compatible APIs, making it ideal for embedding advanced editing features into any web application.
This article explains the mathematical foundations of fractals, demonstrates how to use Canvas coordinate transformations and vector operations, and provides complete JavaScript code for drawing classic fractals such as the Koch snowflake, hexagonal snowflake, and a binary tree using recursive algorithms.
This article explains how to use the GoGoCode CLI tool to automatically convert Vue 2 projects to Vue 3 by following the official migration guide, installing the tool, running conversion commands, reviewing generated code, and handling common break‑change scenarios such as async components, custom directives, and API updates.
This article walks you through the fundamentals of abstract syntax trees, Babel, and Webpack's build process, then shows how to implement a simple mini‑webpack from scratch, install dependencies, configure the project, run the build, and verify the bundled output.
This article introduces Alibaba’s Cube technology, tracing its evolution from early hybrid native‑web approaches to a custom rendering engine that powers dynamic cards and mini‑programs on mobile and IoT devices, and outlines its architecture, tooling, quality system, and future roadmap.
This guide walks you through creating a client‑side static Wikipedia by downloading a dump, converting it to a SQLite database compiled to WebAssembly, and building a JavaScript front‑end that can be deployed on any static‑file host.
This article explains why using if‑else for state handling violates the Open‑Closed Principle, introduces the State design pattern with a light‑switch example, demonstrates its implementation in JavaScript (including class‑based and functional FSM libraries), and compares it to the Strategy pattern.
The article reviews the recent TC39 meeting, outlines the criteria for advancing proposals to Stage 4, and explains several upcoming ECMAScript features—including the relative‑indexing .at() method, Object.hasOwn, class static initialization blocks, the pipeline operator, and other proposals—providing code examples and implementation status.
