This article explores how to optimize Babel usage to reduce bundle size and improve performance by addressing helper duplication, third-party module handling, and import optimization through transform-runtime, include patterns, and import transformation plugins.
This article surveys the essential JavaScript full‑stack development ecosystem, detailing runtime environments, popular IDEs, build automation tools, testing frameworks, performance utilities, and debugging solutions, guiding developers in selecting the right tools for efficient front‑end and back‑end development.
This article provides a concise overview of the ten most impactful ES6 features—including default parameters, template literals, multi‑line strings, destructuring, enhanced object literals, arrow functions, promises, block‑scoped let/const, classes, and modules—explaining their syntax, benefits, and practical usage for modern JavaScript development.
This tutorial provides a comprehensive, step‑by‑step guide to Webpack, covering its purpose as a JavaScript module bundler, installation, command‑line usage, configuration files, Babel and Handlebars loaders, plugins such as html‑webpack‑plugin, lazy‑loading, vendor chunk creation, and best practices for modern front‑end development.
This article explains how to use pure JavaScript to retrieve an element’s final computed background‑color, covering inline and external styles, handling special cases like display, opacity, and visibility, and provides a recursive implementation with code examples and improvement suggestions.
This article explains how key ES6 features—arrow functions, array methods, destructuring, enhanced object literals, classes, and block‑scoped variables—can streamline WeChat Mini Program development, improve code readability, and increase development efficiency.
This comprehensive guide walks beginners through JavaScript basics, DOM interaction, debugging, experiments, advanced concepts, frameworks, design patterns, and resources, providing a clear roadmap to become a proficient front‑end developer.
Learn how to create, customize, and extend jQuery plugins—from basic concepts and simple color-changing examples to chainable calls, avoiding $ symbol conflicts, handling parameters, and using $.extend and $.fn.extend—while understanding the underlying prototype mechanism and best practices.
This tutorial explains how to create a left‑swipe delete effect in a WeChat Mini Program list view by layering items, using absolute positioning, and handling touchstart, touchmove, and touchend events to move items and reveal action buttons based on swipe distance.
An in‑depth look at a common interview puzzle that prints “0 1 2 3 3 3”, explaining how JavaScript’s asynchronous setTimeout, function scope, and closures interact, why the output occurs, and how to modify the code to achieve the expected 0‑1‑2 sequence.
The article recaps the first Frontend Technology Salon, covering ES6 fundamentals, Webpack packaging, and practical ES6 asynchronous programming examples, offering detailed explanations and code demonstrations for frontend developers and highlights common pitfalls and browser compatibility issues.
This article presents a comprehensive guide to front‑end performance optimization, covering reduction of HTTP requests, proper handling of repaint/reflow, minimizing DOM operations, using JSON, efficient HTML/CSS, CDN acceleration, external resource loading, minification, image compression, and cookie management.
The article explores why mathematically equal expressions like 5×3 and 5+5+5 are not necessarily equivalent, explains the distinction between equality and equivalence, illustrates with real‑world and programming examples such as JavaScript’s == versus === and matrix multiplication rules, and discusses teaching implications.
The article analyzes doT.js, a compact 6 KB, dependency‑free JavaScript template engine that builds rendering functions via regex‑based code generation, avoids the costly with statement, caches compiled templates, and delivers superior performance in benchmarks compared with jQuery‑tmpl and other minimal engines, while noting its less intuitive syntax for complex conditionals.
This article explains how Node.js initializes by combining Google’s V8 engine with the libuv asynchronous I/O library, details the main function flow, event loop, thread pools, environment creation, module binding, and demonstrates exposing a C++ object to JavaScript via a native addon.
The article walks through creating an HTML5 remake of the Chinese “Don’t Stop! 8‑Note Sauce” game, where microphone volume drives a doge‑block character to walk and jump over dynamically generated pits, detailing configuration, barrier management, collision detection, and WebAudio voice‑control implementation using getUserMedia, AudioContext, and analyser nodes.
This article explains how setTimeout works in JavaScript, covering its two parameters, the unique timer ID, the event‑queue execution after the call stack clears, and how closures can be used to preserve loop indices for correct output.
In a playful interview, React explains its origins at Facebook, the virtual DOM mechanism, component design principles, performance optimizations, and real‑world usage, while code examples illustrate how the library simplifies UI development for modern web applications.
This article quickly guides you through the evolution of JavaScript modularization, covering early patterns, major specifications like AMD, CommonJS, UMD, ES6 modules, as well as loaders and bundlers, so you can grasp core concepts and practical code examples in just ten minutes.
This article explains how to use the ajaxFileUpload jQuery plugin for asynchronous file uploads, detailing its syntax, configuration options, integration steps with HTML, JavaScript, and Java backend code, and provides practical notes on styling and compatibility.
This tutorial walks through setting up a Node.js WebSocket server, creating a PC client and a WeChat Mini Program client, and enabling bidirectional communication so the mini program can remotely control a projector screen.
This article introduces the WePY framework for WeChat mini‑programs, covering its purpose, demo projects, quick‑start commands, project structure, component architecture, data binding, event communication, plugin support, and advanced configuration, providing developers with a comprehensive reference for modern mini‑program development.
JavaScript functional programming, once a niche topic, has surged in popularity since ES6, and this article explores practical implementations—showcasing functional code versus traditional approaches, benefits like clearer semantics and reusability, common models such as closures, higher‑order functions, currying, and composition, plus optimization techniques.
This article provides a comprehensive guide to common JavaScript techniques for working with JSON, covering object and array structures, converting between JSON strings and objects, pretty‑printing with JSON.stringify, string replacement for log processing, and methods for iterating and recursively traversing JSON data.
This article introduces TypeScript as a Microsoft‑created superset of JavaScript that adds static typing, explains its type‑system fundamentals, compares it with lint tools, showcases practical code examples—including interfaces, implementations, and function overloads—and demonstrates how static analysis can catch bugs early and improve documentation for both front‑end and Node.js projects.
Lego is a component-based front-end page assembly platform at Meituan, enabling rapid low-code page building via drag‑drop components, with an Assembly Factory UI, developer SDKs, event‑based component communication, and a rendering engine that outputs HTML/FreeMarker, reducing development time and standardizing UI across projects.
This article examines how JavaScript parsing, compilation, and execution dominate web page startup time, presents data from V8 runtime statistics across desktop and mobile browsers, and offers practical techniques—such as code splitting, script streaming, and code caching—to dramatically reduce launch delays.
This article explains the evolution of JavaScript module patterns—including CommonJS, AMD, CMD, and ES6—by illustrating their syntax, loading behavior, and practical drawbacks, and shows how to simulate modularity with simple global objects and closures.
This article explains the inner workings of requestAnimationFrame, detailing why setTimeout/setInterval fall short, how Chrome's animation controller registers and fires callbacks, and the call stack that drives frame updates, complete with code excerpts and diagrams.
Learn how to create a simple, custom JavaScript error‑tracking system that logs client‑side exceptions to a server, stores them in a database, and notifies users, offering a low‑cost alternative to heavyweight services for small web projects.
This article explores JavaScript’s primitive and reference types, detailing their immutability, assignment behavior, memory storage, comparison methods, and the role of wrapper objects, supplemented with clear code examples and diagrams to illustrate how values and objects are handled in memory.
This article introduces Baidu's open‑source ECharts library, walks through installing the JavaScript package, embedding it in a web page, and demonstrates using the Python ECharts API to create interactive charts, while highlighting key setup notes and resources.
This article provides a comprehensive guide to Snap.svg, explaining its purpose, API similarities with jQuery, core classes like Element and Paper, various animation techniques—including element and static animations, path and matrix transformations—along with compatibility tips, performance recommendations, and useful code examples.
This article presents practical JavaScript guidelines for naming variables, structuring functions, and avoiding common pitfalls, illustrating each bad pattern with concise code examples and showing the improved, more readable alternatives to help developers write cleaner, maintainable code.
This tutorial explains how to create a WebVR page using the WebVR API and three.js, covering VR and naked‑eye modes, required plugins, HTML setup, scene construction, camera, renderer, a rotating cube, and integration of VR controls, effects, and manager for a complete immersive experience.
This comprehensive guide explores the fundamentals of API design for front‑end development, covering naming conventions, lexical correctness, parameter ordering, return values, versioning, and extensibility, and provides practical code examples to help developers create intuitive, maintainable, and future‑proof interfaces.
This article explains what JavaScript decorators are, how they work on classes and methods, how to configure Babel for ES7 support, and demonstrates real‑world uses such as mixins and simple AOP, providing clear code examples throughout.
This article explains how to transition from traditional MVC architecture to Redux when building a React‑Native mobile app, detailing the analogies between actions, reducers, stores, and components, and provides step‑by‑step code examples for implementing state management in JavaScript.
This article explains the concept of a stack as a LIFO data structure, shows how to implement a Stack class in JavaScript with essential methods like push, pop, size, empty, peek, and clear, and demonstrates practical usage through recursive and iterative factorial calculations.
This article presents a comprehensive guide to front‑end performance optimization, covering how to prioritize bottlenecks, use debounce/throttle, reduce DOM reflows, optimize rendering, leverage requestAnimationFrame and Web Workers, and apply efficient CSS and script loading strategies, all illustrated with practical code examples.
This article presents practical JavaScript clean‑code guidelines—including intention‑revealing naming, single‑purpose functions, pure functions, proper async handling, and linting standards—to help developers write more readable, maintainable, and error‑free code.
This guide explains the concept of image lazy loading, how to detect when an image enters the viewport, and provides a complete vanilla‑JavaScript implementation with throttled scroll handling to improve page performance and reduce bandwidth usage.
Learn how to ensure that a user list page instantly reflects edits made on a separate detail page in a WeChat Mini Program by using a lightweight broadcast utility, avoiding full page reloads and improving user experience.
This article offers a comprehensive guide for newcomers to web front‑end development, covering project engineering basics, emerging development directions, the current job market, essential frameworks and tools, and practical tips for overcoming common challenges.
This article explains three methods to provide visual touch feedback on mobile web pages—using the :active pseudo‑class with a touchstart handler, the non‑standard -webkit‑tap‑highlight‑color property, and custom touch event listeners that add and remove an active class, plus tips for handling the 300 ms delay.
This article, the third in a series on constructing high‑scalable web interactive systems, demonstrates how to use NetEase's NEJ framework to decompose complex SPA modules, define hierarchical and dependency trees, register external and layout modules, map functionalities, and configure the entire application for scalable development and maintenance.
This article introduces Socket.IO, explains its features and transport fallback mechanisms, showcases a real‑world example (tty.js Linux terminal), and provides a step‑by‑step guide to create a simple web page that displays the server’s current time using Node.js and client‑side JavaScript.
This article explains why readable code matters for developers, then offers practical guidelines on naming variables and functions, structuring conditional branches, keeping functions single‑purpose, handling errors, avoiding side‑effects, and organizing class methods to improve maintainability in modern JavaScript projects.
This tutorial walks you through creating a simple timer application with Vue 2.0, Vue‑Router, Vuex and Webpack, highlighting the differences from Vue 1.0, showing project setup, file structure, core code snippets, and best practices for state management.
This article explains the core principles of Redux, when to adopt or avoid it, and provides a detailed walkthrough of its architecture, key components, and practical integration with React, including store creation, reducers, actions, middleware, and project structure.
This sixth installment of the Quick Q&A column answers common front‑end questions about CSS vertical‑align, equal‑height columns, JavaScript learning resources, code‑review feedback, and provides practical career guidance for aspiring web developers.
This article explains how JavaScript’s execution stack, heap, event loop, and setTimeout work together, illustrating their behavior with visual diagrams and examples that reveal common pitfalls such as blocking code and minimum timer delays.
In this fifth Quick Q&A episode, the author answers several front‑end questions covering how to make a background image adapt to a container, CSS animation compatibility across browsers, clearfix techniques, learning resources for JavaScript, choosing a Vue.js framework, and practical career advice for aspiring developers.
Based on data from TIOBE, PYPL, StackOverflow, GitHub, Indeed, Glassdoor and other sources, this article examines which programming languages are most popular worldwide and most in demand by industry, highlighting trends such as Java’s dominance, the rise of Python, JavaScript’s prevalence, and emerging languages for 2017.
This article explains the historical problems of callback hell and ineffective return/throw in asynchronous JavaScript, introduces Promises as a contract‑based solution that flattens nesting, enables proper error handling, and outlines their core API and usage patterns.
This article dissects a 1 KB js1k competition entry that builds a 3‑D forest‑fire game using only built‑in canvas variables, explaining the competition rules, the demo’s gameplay, the compact object‑creation logic, the clever key‑state handling, and the full event‑loop rendering pipeline.
This article explains how to classify, propagate, and handle both operational and coding errors in Node.js, offering practical guidelines, code examples, and best‑practice recommendations for building robust backend applications.
This comprehensive guide explains what regular expressions are, their practical uses in data validation and string manipulation, the syntax of literals and constructors, key String and RegExp methods, character classes, quantifiers, anchors, groups, assertions, flags, and the behavior of JavaScript's NFA engine, all illustrated with clear code examples.
Based on a recent survey, the most widely used JavaScript libraries like jQuery, React, and lodash dominate front‑end development, while emerging frameworks such as Vue.js gain attention; module bundlers, linting tools, unit testing frameworks, and CSS processors show growing adoption and shifting popularity trends.
The Web Audio API is a high‑level JavaScript interface that lets developers create and connect modular AudioNodes within an AudioContext to process, filter, visualise, and spatialise sound, supporting sources such as media elements, streams, and buffers, and enabling real‑time recording, clipping, and karaoke applications.
UAParser.js is a lightweight, dependency‑free JavaScript library that parses the User‑Agent string to provide detailed browser, engine, OS, CPU, and device information, with examples for both browser and Node.js environments, and outlines its main methods and installation steps.
This article presents a 20‑question front‑end interview test compiled in 2013, covering HTML, CSS, JavaScript, HTTP and related topics, with scoring guidelines, answer intentions, solution outlines and reference answers to help assess candidates quickly.
This article introduces Vue.js fundamentals, compares its similarities and differences with React, demonstrates a sample project structure with component examples, and guides readers on obtaining the demo repository and exploring Vue 2.0 enhancements, providing a practical hands‑on overview for front‑end developers.
This article explains the pitfalls of JavaScript arrow functions, showing when they break object methods, event callbacks, and constructors, and offers clear examples and corrected code to help developers choose between arrow functions and traditional function expressions.
This comprehensive guide explains what WeChat Mini Programs are, their underlying framework, supported components and APIs, development workflow, modular design patterns, differences from traditional H5 apps, debugging, building, publishing, and practical advantages and limitations for mobile front‑end developers.
The article examines common problems with npm such as the left‑pad incident and semver volatility, explains how shrinkwrap can freeze dependencies, and shows how Yarn’s automatic lockfile, faster parallel installation, and better user feedback improve reliability and developer productivity.
This article delves into ES6’s advanced features—including dynamic module loading, Symbol usage, iterators, Maps, Sets, Weak collections, Promises, async‑await, generators, and meta‑programming tools like Proxy and Reflect—providing concise explanations, code snippets, and practical guidance for modern JavaScript development.
This article explains how decorators—originally popularized in Python—can be applied in JavaScript ES6, covering their syntax, class and property use cases, underlying mechanics with Object.defineProperty, and practical Babel transpilation steps.
This article introduces WeChat Mini Programs, compares them with Web Apps and other lightweight app models, explains their component‑based development workflow, key APIs, routing and styling, and discusses the cost, promotion, and future prospects of building mini‑apps on the WeChat platform.
This article traces the origins of virtual reality from early concepts and devices to modern headsets, then introduces the A-Frame web framework and provides a step‑by‑step tutorial with code examples for creating VR scenes, animations, and interactions in the browser.
This article traces the origin of debugging from the historic moth incident, explains Chrome and Android remote debugging setup, permission constraints, and dives deep into V8's JavaScript debugging mechanisms such as Debugger.enable, getScriptSource, and setBreakpointByUrl.
This article walks through creating a simple WeChat Mini Program that searches and displays DouBan book information, covering API usage, project setup, page design, event handling, network requests, pagination, and code organization with practical code examples.
A humorous 2016 dialogue walks through the shift from jQuery to React, explaining JSX, ES6+, Babel, module bundlers, task runners, TypeScript, Flow, Fetch API, and template engines, while highlighting the rapid evolution of frontend tooling and best practices.
This guide introduces Yarn, Facebook’s fast JavaScript package manager, shows how to install it, and provides a side‑by‑side comparison of common npm commands with their Yarn equivalents, highlighting unique features of each tool for more efficient frontend development.
The article details how Facebook built Yarn to overcome npm’s consistency, security, and speed limitations, describing the evolution of their package‑management workflow, Yarn’s lockfile architecture, parallel installation process, additional features, production adoption, and simple commands to get started.
Based on GitHub and RedMonk statistics, this article reviews the most popular programming languages in 2016, explains why JavaScript, Java, Python, Ruby, PHP, C++, and others rank highly, and offers guidance on choosing a language that fits individual career goals and project needs.
This guide explains the evolution of Apple’s Force Touch to 3D Touch, lists supported iPhone models, describes Quick Actions and Peek‑and‑Pop interactions, and provides step‑by‑step code for detecting touch pressure in Safari 10 using Touch.force and the touchforcechange event.
This article explains why encodeURIComponent can raise a URI malformed error, clarifies the concepts of high and low surrogate pairs, and provides a comprehensive overview of character sets, Unicode, and the UTF‑8 and UTF‑16 encodings used in JavaScript.
This article explains how to build and use compose functions in JavaScript—including two‑argument, variadic, and prototype‑based versions—demonstrates practical examples, and highlights the benefits of pure functions and functional composition for modular, testable frontend code.
Learn how JavaScript’s setTimeout and setInterval functions work, see practical code examples, understand their timing inaccuracies and common pitfalls, and discover how recursive setTimeout can provide more reliable scheduling by avoiding overlapping executions.
This article provides a comprehensive, English‑language reference of common JavaScript DOM APIs—including element selection, class manipulation, node operations, attribute handling, content updates, CSS styling, size calculations, event binding, DOM ready detection, context binding, whitespace trimming, Ajax requests, JSON parsing, and node traversal—complete with code examples for each feature.
This article explains how Babel parses ES6 code into an AST, traverses and modifies nodes using visitors and paths, and demonstrates a practical plugin that replaces a custom abs function with Math.abs, providing a solid foundation for building advanced JavaScript transformations.
This article provides a concise overview of WeChat Mini Program development, detailing the project’s directory structure, file types (js, wxml, wxss, json), core logic layer, data binding, API usage, modularization, and view components with practical code examples to help newcomers quickly grasp the overall design.
The article reviews the Node.js Interactive Europe presentation, outlining Node.js v7’s planned V8 upgrade, new language features like async/await, a beta release strategy, ecosystem stability tools, web standard adoption, IoT suitability, VM neutrality, and community inclusivity initiatives.
Microsoft released TypeScript 2.0 on the 22nd of this month, introducing non‑nullable types, control‑flow based type analysis, simpler module declarations, and read‑only properties, while also integrating ES2015 features, modules, decorators, and tighter Angular collaboration, and can be installed via npm.
This article answers common front‑end questions, covering clear class‑naming practices, how to associate labels with form controls, why Gulp and Webpack are preferred over FIS, recommended JavaScript and mobile‑web books, CSS framework trade‑offs, and career advice for beginners.
This article compiles essential frontend interview questions, key knowledge areas, and detailed explanations covering HTML, CSS, JavaScript, browser engines, storage APIs, and best practices, helping beginners build a solid foundation and prepare effectively for technical interviews.
This guide explains what Browserify is, why it’s useful for front‑end developers, how it works, and provides step‑by‑step examples—including npm package usage, custom modules, debugging, and automatic bundling with watchify—to help you efficiently bundle JavaScript for the browser.
Learn how to use ANSI escape codes in Node.js to transform dull black‑and‑white terminal output into colorful, readable command‑line interfaces, with simple examples like printing red text, enabling developers to create more engaging CLI tools.
This article explains the syntax, usage patterns, and differences of JavaScript’s call, apply, and bind methods, showing how they manipulate a function’s this value, convert arguments objects to arrays, and create bound functions with preset parameters.
This tutorial introduces Electron, the Chromium‑Node.js framework for building cross‑platform desktop apps with HTML, CSS and JavaScript, walks through a simple “Hello World” project, explains its main and renderer processes, key modules such as IPC, remote and webview, and shows how to package the app for Windows and macOS.
This tutorial walks you through the reasons for using SPA, why Vue.js is a lightweight alternative to React, how to set up the Node environment, configure Webpack, create components, manage routing, handle component lifecycles, and implement nested routes with practical code examples.
This article highlights three of the most valuable performance optimization techniques used in the widely adopted Bluebird Promise library—minimizing function object allocation, reducing object size, and employing lazy‑overwritten no‑op functions—to help developers write faster, more efficient JavaScript code.
This article introduces WebVR, an experimental JavaScript API that enables VR experiences on the web, walks through setting up a three.js‑based boilerplate, explains key files like VRControls.js, VREffect.js, and webvr‑polyfill.js, and shows how to create a simple rotating cube demo for mobile cardboard viewers.
This article provides a comprehensive guide to SeaJS, covering its CMD‑based module definition, the define syntax, factory parameters, module identifiers, startup process, debugging tools, loading flow, and key differences from RequireJS, with practical code examples and reference links.
This article shares real‑world Node.js pitfalls—from unsafe decodeURIComponent usage and hidden Promise errors to unhandled HTTP request failures—explaining why they occur and providing practical code‑level solutions such as try‑catch wrappers and proper error event handling to keep applications stable.
This article introduces ES2015 arrow functions, showing their concise syntax, how they differ from traditional function expressions, the implicit handling of the this context, and practical examples that eliminate the need for manual this binding, helping developers write cleaner JavaScript.
This article explains how ECMAScript 6 improves JavaScript function parameters with rest and spread operators, default values, and destructuring, showing syntax, practical examples, browser support, and best‑practice tips for writing clearer, more maintainable code.
Learn how to use Facebook’s jscodeshift tool to write codemods that automatically rename lifecycle methods in JavaScript components, with step‑by‑step examples, test setup using AVA, and detailed AST traversal logic for precise transformations.
This guide explains why test cases are essential, compares TDD and BDD agile approaches, and introduces key frontend testing tools—including Mocha for test suites, Should for assertions, Nock for HTTP mocking, and Istanbul for coverage—while providing code examples and best‑practice recommendations for writing maintainable, high‑quality tests.
