BestHub
Sign in
Tagged articles

JavaScript

2473 articles · Page 11 of 25
ByteFE
ByteFE
Dec 16, 2022 · Frontend Development

Curated Technical Insights: Vite 4 Release, Overdesign Pitfalls, Node.js Automation, React Native Monorepo, Chrome Memory/Energy Modes, First Principles Thinking, WebRTC Face Recognition, JavaScript Best Practices, and Web Workers

This newsletter presents a collection of technical articles covering the Vite 4 release, the dangers of over‑design, building Node.js automation workflows, React Native monorepo practices, Chrome's memory and energy saver modes, first‑principles thinking for engineers, WebRTC face‑recognition implementation, JavaScript best practices, and an overview of Web Workers.

JavaScriptNode.jsWebRTC
0 likes · 8 min read
Curated Technical Insights: Vite 4 Release, Overdesign Pitfalls, Node.js Automation, React Native Monorepo, Chrome Memory/Energy Modes, First Principles Thinking, WebRTC Face Recognition, JavaScript Best Practices, and Web Workers
KooFE Frontend Team
KooFE Frontend Team
Dec 15, 2022 · Frontend Development

How to Avoid Common React useState Mistakes and Write Cleaner Code

This article explains frequent misuse patterns of React's useState hook—redundant, duplicate, contradictory, and over‑reliance on useEffect—showing why they hurt readability and maintenance, and provides concise refactor solutions using derived state, IDs, and useReducer.

JavaScriptReActuseState
0 likes · 14 min read
How to Avoid Common React useState Mistakes and Write Cleaner Code
ELab Team
ELab Team
Dec 14, 2022 · Frontend Development

Mastering ESLint: How AST Powers Code Linting and Custom Rules

This article explores the fundamentals of ESLint, explaining how it leverages abstract syntax trees (AST) to enforce code style, detect errors, and enable custom rule creation, while providing practical configuration examples, code snippets, and insights into the underlying processing pipeline.

ASTCode styleCustom Rules
0 likes · 16 min read
Mastering ESLint: How AST Powers Code Linting and Custom Rules
37 Interactive Technology Team
37 Interactive Technology Team
Dec 12, 2022 · Frontend Development

Understanding the JavaScript "this" Keyword: From Basics to Deep Insights

This article demystifies JavaScript’s this keyword by covering its runtime binding rules in global, function, method, constructor, prototype, and arrow contexts, explaining strict‑mode differences, call/apply/bind usage, event‑handler behavior, and the underlying ECMAScript reference mechanics that determine its value.

Arrow FunctionsJavaScriptPrototype
0 likes · 16 min read
Understanding the JavaScript "this" Keyword: From Basics to Deep Insights
ByteFE
ByteFE
Dec 12, 2022 · Frontend Development

Understanding JavaScript Asynchronous Mechanisms and the Event Loop

This article explains why JavaScript, despite being single‑threaded, needs asynchronous mechanisms such as the event loop, details macro‑ and micro‑tasks, compares browser and Node.js implementations, and demonstrates common pitfalls and best practices using callbacks, Promise, generator, and async/await patterns.

JavaScriptNode.jsPromise
0 likes · 16 min read
Understanding JavaScript Asynchronous Mechanisms and the Event Loop
KooFE Frontend Team
KooFE Frontend Team
Dec 8, 2022 · Fundamentals

Boost Your Coding Skills with CodinGame’s Interactive Challenges

CodinGame turns programming puzzles into games, letting you write code that instantly visualizes results, learn basic JavaScript logic like selecting the nearest enemy, and explore a variety of difficulty levels across multiple languages while enjoying a fun, gamified learning experience.

JavaScriptalgorithm practicecoding games
0 likes · 3 min read
Boost Your Coding Skills with CodinGame’s Interactive Challenges
ELab Team
ELab Team
Dec 7, 2022 · Frontend Development

Mastering AST: How Frontend Compilers Transform Code with Babel

This article explains the fundamentals of abstract syntax trees (AST) in frontend development, covering their generation, role in code transformation, and practical use of Babel plugins to instrument and modify JavaScript code, with detailed examples and code snippets.

ASTBabelJavaScript
0 likes · 13 min read
Mastering AST: How Frontend Compilers Transform Code with Babel
MoonWebTeam
MoonWebTeam
Dec 4, 2022 · Frontend Development

Why Svelte Beats Vue3 and React: Real-World Performance Gains and Core Mechanics

This article presents a comprehensive investigation of Svelte, detailing its dramatic bundle size reduction, performance improvements, compilation-based architecture, core implementation, advantages, drawbacks, and practical usage guidelines, supported by real project data, npm and GitHub statistics, and code examples to help developers confidently adopt Svelte.

CompilationFramework ComparisonJavaScript
0 likes · 30 min read
Why Svelte Beats Vue3 and React: Real-World Performance Gains and Core Mechanics
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Dec 2, 2022 · Frontend Development

Essential Frontend Techniques: Tree‑Shaking, Code Readability, and Performance Hacks

Explore a curated collection of frontend articles covering bundler tree‑shaking, code readability tricks, precision handling with big.js, hidden CSS features, Apple‑style scrolling effects, ready‑made visual dashboard demos, and performance insights like reducing jank and mastering LightHouse workflows.

JavaScriptPerformancebundling
0 likes · 4 min read
Essential Frontend Techniques: Tree‑Shaking, Code Readability, and Performance Hacks
21CTO
21CTO
Dec 1, 2022 · Frontend Development

Say Goodbye to Bad JavaScript Practices: 8 Essential Tips for Clean Code

This article outlines eight practical JavaScript habits—using let/const, writing meaningful comments, preferring == over ===, leveraging optional chaining, avoiding magic values, handling async errors, passing multiple parameters instead of a single object, and using concise conditionals—to produce more maintainable, readable, and robust code.

JavaScriptclean codecode comments
0 likes · 7 min read
Say Goodbye to Bad JavaScript Practices: 8 Essential Tips for Clean Code
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 30, 2022 · Frontend Development

Building an Interactive 3D Phone Showcase with Three.js Multimedia Elements (Text, Image, Audio, Video)

This article explains how to use Three.js to create a realistic 3D phone product page by loading and applying multimedia assets such as custom fonts, textures, audio sources, and video textures, and demonstrates interactive features like ray‑casting for material switching and first‑person controls.

3DJavaScriptThree.js
0 likes · 19 min read
Building an Interactive 3D Phone Showcase with Three.js Multimedia Elements (Text, Image, Audio, Video)
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 29, 2022 · Frontend Development

Comprehensive Guide to Using Entity and Primitive Methods for 3D Earth Visualization with Cesium

This article provides an in‑depth tutorial on creating and customizing Cesium entities and primitives—including boxes, points, and various geometric shapes—explaining their properties, visual attributes, performance considerations, and offering complete JavaScript code examples for interactive 3D earth visualizations.

3d-visualizationCesiumGeospatial
0 likes · 18 min read
Comprehensive Guide to Using Entity and Primitive Methods for 3D Earth Visualization with Cesium
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 25, 2022 · Frontend Development

Vue Compiler Overview and Sandbox Compilation Techniques

This article explores the fundamentals of Vue's compilation process, compares Vue 2 and Vue 3 compilers, demonstrates sandbox compilation with code examples, and discusses practical considerations such as handling templates, scripts, styles, and hot‑module reloading, providing developers with insights to effectively integrate Vue compilation in browser environments.

JavaScriptSandboxVue
0 likes · 17 min read
Vue Compiler Overview and Sandbox Compilation Techniques
ELab Team
ELab Team
Nov 25, 2022 · Artificial Intelligence

How to Build a Real‑Time Virtual Avatar with CNN and face‑api.js

This tutorial explains how to create a simple virtual avatar system by combining convolutional neural networks, the face‑api.js library, and WebRTC, covering CNN fundamentals, face detection, landmark extraction, model selection, and rendering techniques with code examples.

CNNJavaScriptWebRTC
0 likes · 13 min read
How to Build a Real‑Time Virtual Avatar with CNN and face‑api.js
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 23, 2022 · Frontend Development

Implementing a Camera and View Matrix in WebGL

This article explains how to create a Camera class in WebGL, compute view and rotation matrices using lookAt, apply them to render a cube from arbitrary positions, and discusses why parts of the cube may be clipped when the camera is placed at [0.5,0.5,0.5].

3DGraphicsCameraJavaScript
0 likes · 14 min read
Implementing a Camera and View Matrix in WebGL
ByteFE
ByteFE
Nov 21, 2022 · Frontend Development

Understanding and Mastering JavaScript Promises: Basics, Advanced Usage, and Best Practices

This article provides a comprehensive overview of JavaScript Promises, covering their definition, states, basic usage, error handling, chaining, common APIs, best practices, advanced scenarios such as preloading and cancellation, as well as manual implementation techniques, to help front‑end developers deepen their asynchronous programming skills.

JavaScriptPromiseWeb Development
0 likes · 25 min read
Understanding and Mastering JavaScript Promises: Basics, Advanced Usage, and Best Practices
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 18, 2022 · Frontend Development

Creating a Glowing Portal Effect in Three.js with Post‑Processing

This article demonstrates how to use Three.js post‑processing techniques, including EffectComposer, RenderPass, BloomPass, and custom shaders, to build an animated 3D scene featuring a glowing portal and Rick and Morty model, covering shader setup, layer management, animation, and UI controls for fine‑tuning.

3D animationJavaScriptShader
0 likes · 24 min read
Creating a Glowing Portal Effect in Three.js with Post‑Processing
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 17, 2022 · Frontend Development

Deep Dive into requestIdleCallback API and Its Use with React

This article explains the requestIdleCallback web API, its syntax, execution timing, task‑queue handling, performance characteristics, compatibility issues, and practical integration with React and requestAnimationFrame to off‑load low‑priority work without blocking UI rendering.

Idle TasksJavaScriptPerformance
0 likes · 14 min read
Deep Dive into requestIdleCallback API and Its Use with React
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 16, 2022 · Frontend Development

Understanding Vite: A Comprehensive Guide to Its Advantages Over Webpack

This article explains what build tools are, compares Vite and Webpack in terms of performance and architecture, and details Vite's features such as dependency pre‑bundling, CSS handling, static asset imports, TypeScript support, environment variables, and production build configuration, providing practical code examples for frontend developers.

JavaScriptTypeScriptfrontend
0 likes · 14 min read
Understanding Vite: A Comprehensive Guide to Its Advantages Over Webpack
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 15, 2022 · Frontend Development

Understanding requestAnimationFrame: Usage, Timing, Performance, and Compatibility

This article explains the requestAnimationFrame API, demonstrates basic and cancelable animation examples, discusses its execution timing within the browser frame lifecycle, compares its performance to setTimeout, covers compatibility and polyfills, and shows how to wrap it in a React hook for practical use.

BrowserJavaScriptPolyfill
0 likes · 11 min read
Understanding requestAnimationFrame: Usage, Timing, Performance, and Compatibility
ELab Team
ELab Team
Nov 12, 2022 · Frontend Development

Build Your Own Mini Webpack: A Step‑by‑Step Guide to Single‑Entry Bundling

This article walks through creating a minimal webpack implementation that bundles a single entry file, covering prerequisite knowledge, initialization parameters, compilation steps, loader handling, dependency resolution, chunk creation, and file generation, complete with code examples and explanations.

Build ToolBundlerJavaScript
0 likes · 12 min read
Build Your Own Mini Webpack: A Step‑by‑Step Guide to Single‑Entry Bundling
GuanYuan Data Tech Team
GuanYuan Data Tech Team
Nov 10, 2022 · Frontend Development

How to Build Plugin‑Based Custom Charts with Web Components in a React Data Platform

This article explains why a data‑analysis platform needs a plugin architecture for custom charts, compares iframe‑based and Web Components approaches, shows how to implement a lightweight ECharts‑based chart plugin, and provides step‑by‑step code samples and technical selection criteria for frontend developers.

Custom ChartsEChartsJavaScript
0 likes · 17 min read
How to Build Plugin‑Based Custom Charts with Web Components in a React Data Platform
Huolala Tech
Huolala Tech
Nov 10, 2022 · Frontend Development

Seamlessly Migrate Taro 2.x to 3.x with Babel AST Transformations

This article explains how to upgrade Taro 2.x projects to Taro 3.x by converting source code into an AST using Babel, programmatically editing imports, configs, routers, and styles, and then generating the updated code, complete with practical code examples and migration tips.

ASTBabelJavaScript
0 likes · 14 min read
Seamlessly Migrate Taro 2.x to 3.x with Babel AST Transformations
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 9, 2022 · Fundamentals

Understanding JavaScript Prototype Chain Through the ECMAScript Specification

This article delves into the ECMAScript specification to precisely explain how JavaScript's prototype chain and property lookup work, covering essential internal methods like [[Get]], property descriptors, reference records, and the role of the Receiver parameter, with illustrative code examples and diagrams.

ECMAScript SpecificationInternal MethodsJavaScript
0 likes · 15 min read
Understanding JavaScript Prototype Chain Through the ECMAScript Specification
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 9, 2022 · Fundamentals

Understanding JavaScript Variable Lookup and Scope from the ECMAScript Specification and V8 Engine Perspective

The article explains how JavaScript variable lookup and lexical scope are determined during compilation by the V8 engine, covering the language's compiled‑and‑interpreted nature, JIT optimizations, AST generation, lazy parsing, dynamic lookups, and bytecode creation to demystify runtime performance.

CompilationECMAScriptJIT
0 likes · 14 min read
Understanding JavaScript Variable Lookup and Scope from the ECMAScript Specification and V8 Engine Perspective
ByteFE
ByteFE
Nov 8, 2022 · Frontend Development

Understanding the JavaScript Event Loop in Browsers and Node.js

This article explains the fundamentals of JavaScript's event loop, covering browser asynchronous execution, macro‑ and micro‑tasks, timer inaccuracies, view rendering, and the differences in Node.js implementation, while providing code examples to illustrate execution order and practical implications for developers.

BrowserJavaScriptNode.js
0 likes · 18 min read
Understanding the JavaScript Event Loop in Browsers and Node.js
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Nov 4, 2022 · Frontend Development

Top Frontend Tech Insights: WebCodecs Export, Node.js Debugging, JS Error Handling & More

This article curates the latest frontend engineering practices, covering WebCodecs video export, a Node.js troubleshooting guide, JavaScript error handling tips, Apple‑style scroll effects, Turbopack performance benchmarks, monorepo strategies, large‑scale system design, and productivity measurement at Google, all aimed at boosting developer expertise.

JavaScriptMonorepoTurbopack
0 likes · 4 min read
Top Frontend Tech Insights: WebCodecs Export, Node.js Debugging, JS Error Handling & More
ByteFE
ByteFE
Nov 2, 2022 · Frontend Development

Understanding WebXR: API Overview, Device Interaction, and VR/AR Development

This article explains the WebXR standard for rendering 3D scenes in browsers, covers its history, browser support, step‑by‑step usage with WebGL, details the WebXR Device API objects such as XRSystem, XRSession, XRReferenceSpace, and demonstrates a panoramic VR image viewer with full code examples.

ARJavaScriptVR
0 likes · 25 min read
Understanding WebXR: API Overview, Device Interaction, and VR/AR Development
php Courses
php Courses
Nov 2, 2022 · Backend Development

Three Methods to Implement Page Redirection in PHP

This article explains three PHP techniques for page redirection—using the header() function, outputting a JavaScript location.href script, and inserting a META refresh tag—each with code examples and explanations of how they work and when to use them.

JavaScriptPHP
0 likes · 3 min read
Three Methods to Implement Page Redirection in PHP
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Nov 2, 2022 · Frontend Development

How Upgrading to Webpack 5 Slashed Build Times by 60% in a Large Music App

This guide details how a massive music‑artist web application reduced its full build time from 140 seconds to 55 seconds and its incremental compile time from up to 80 seconds down to about 1 second by migrating from Webpack 4 to Webpack 5, including preparation steps, configuration changes, and common pitfalls.

Build OptimizationFrontend PerformanceJavaScript
0 likes · 17 min read
How Upgrading to Webpack 5 Slashed Build Times by 60% in a Large Music App
ELab Team
ELab Team
Oct 28, 2022 · Mobile Development

How to Capture Real‑Time Heart Rate Data in a Taro Mini‑Program Using BLE

This tutorial walks through building a Taro mini‑program that connects to a BLE heart‑rate strap, discovers services and characteristics, reads device name and heart‑rate measurements, and handles data conversion, providing code examples and practical insights for mobile developers.

BLEBluetoothHeart Rate
0 likes · 14 min read
How to Capture Real‑Time Heart Rate Data in a Taro Mini‑Program Using BLE
Meituan Technology Team
Meituan Technology Team
Oct 27, 2022 · Fundamentals

An Introduction to Functional Programming in JavaScript

This article offers a concise introduction to functional programming’s history, core concepts such as currying, composition, and immutability, and demonstrates their implementation in JavaScript using arrow functions and utilities like curry, compose, pipe, and map, while comparing functional and object‑oriented approaches.

CurryingFunctional ProgrammingHigher-Order Functions
0 likes · 21 min read
An Introduction to Functional Programming in JavaScript
Meituan Technology Team
Meituan Technology Team
Oct 27, 2022 · Fundamentals

Understanding Functional Programming: Monads, Effects, and Practical Applications in JavaScript

This article reviews the origins of functional programming, explains key concepts such as first‑class functions, monads, and side‑effect handling, demonstrates practical JavaScript examples, compares its advantages and drawbacks, and lists useful libraries and languages for adopting the paradigm.

Functional ProgrammingImmutable DataJavaScript
0 likes · 23 min read
Understanding Functional Programming: Monads, Effects, and Practical Applications in JavaScript
vivo Internet Technology
vivo Internet Technology
Oct 26, 2022 · Frontend Development

Migrating WePY Mini‑Program to UniApp: Compiler Design and Implementation

The Vivo front‑end team built a custom compiler that automatically transforms WePY mini‑program files—including templates, scripts, components, and pages—into UniApp Vue code, cutting the estimated 25‑person‑day migration to seconds, delivering a bug‑free launch and paving the way for open‑sourcing the tool.

BabelJavaScriptUniApp
0 likes · 32 min read
Migrating WePY Mini‑Program to UniApp: Compiler Design and Implementation
Sohu Tech Products
Sohu Tech Products
Oct 19, 2022 · Fundamentals

Understanding the JavaScript Event Loop in Browsers and Node.js

This article explains the fundamentals of JavaScript's event loop, covering single‑threaded execution, the role of macro‑tasks and micro‑tasks, differences between browser and Node.js implementations, and includes code examples that illustrate task scheduling and execution order.

BrowserJavaScriptNode.js
0 likes · 17 min read
Understanding the JavaScript Event Loop in Browsers and Node.js
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 18, 2022 · Frontend Development

Implementing Vue 3 Computed API from Scratch

This article explains how to recreate Vue 3's computed API using the composition API, covering getter/setter handling, effect integration, caching with a dirty flag, dependency tracking, and trigger mechanisms, and provides step‑by‑step code examples to build a functional ComputedRef implementation.

Composition APIJavaScriptReactivity
0 likes · 10 min read
Implementing Vue 3 Computed API from Scratch
Bilibili Tech
Bilibili Tech
Oct 18, 2022 · Frontend Development

Building a Slate.js Rich Text Editor: Toolbar, Lists, and Image Upload

This tutorial walks through the practical steps of extending a Slate.js rich‑text editor with toolbar actions, multi‑level list handling, and a robust image‑upload solution, providing code snippets, implementation details, and design considerations for each feature.

Image UploadJavaScriptReAct
0 likes · 12 min read
Building a Slate.js Rich Text Editor: Toolbar, Lists, and Image Upload
Laravel Tech Community
Laravel Tech Community
Oct 17, 2022 · Frontend Development

Avue.js v2.10.2 Release Overview and Features

The Avue.js framework, a lightweight wrapper of Element UI that emphasizes data‑driven views, introduces version 2.10.2 with new input components, several optimizations, and bug fixes while maintaining ES5 browser compatibility and offering high reusability for table and form scenarios.

Avue.jsElement UIJavaScript
0 likes · 3 min read
Avue.js v2.10.2 Release Overview and Features
ByteFE
ByteFE
Oct 15, 2022 · Frontend Development

Curated Frontend Development Insights: Architecture, Frameworks, WebRTC, Edge Computing, and Practical Patterns

This curated collection presents expert reflections on frontend architecture, surveys the latest JavaScript frameworks, explores micro‑frontend style isolation, explains WebRTC fundamentals, highlights edge‑centric web performance, and offers practical guides on native drag‑and‑drop and the publish‑subscribe design pattern.

Design PatternsJavaScriptWebRTC
0 likes · 6 min read
Curated Frontend Development Insights: Architecture, Frameworks, WebRTC, Edge Computing, and Practical Patterns
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 14, 2022 · Frontend Development

Why Sub‑Application Routes Do Not Update When the Main Application Switches Routes in Qiankun and How to Fix It

This article explains the issue where a Qiankun micro‑frontend main app changes its route but the child app's route does not update, analyzes the underlying cause related to hashchange events, and provides two practical solutions: manually dispatching a hashchange event or replacing Link tags with anchor tags.

HashChangeJavaScriptMicro‑frontend
0 likes · 12 min read
Why Sub‑Application Routes Do Not Update When the Main Application Switches Routes in Qiankun and How to Fix It
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 14, 2022 · Frontend Development

Deep Dive into Vue Router 4 Component Navigation Guards

This article explains the internal implementation of component‑level navigation guards in Vue Router 4, covering guard categories, the full navigation lifecycle, the execution mechanism, and detailed source‑code analysis with examples of extractComponentsGuards, beforeRouteUpdate, beforeRouteEnter, and beforeRouteLeave.

Component GuardJavaScriptNavigation Guard
0 likes · 12 min read
Deep Dive into Vue Router 4 Component Navigation Guards
Taobao Frontend Technology
Taobao Frontend Technology
Oct 14, 2022 · Cloud Native

Boost JavaScript Serverless Performance with Noslate’s Cloud‑Native Runtime

Noslate is an open‑source, cloud‑native project from Alibaba that introduces a lightweight JavaScript runtime, optimized Node.js distribution, and an offline debugger to dramatically improve serverless cold‑start times, elasticity, and diagnostic capabilities across diverse platforms, including ARM and traditional x86 environments.

DebuggingJavaScriptNode.js
0 likes · 18 min read
Boost JavaScript Serverless Performance with Noslate’s Cloud‑Native Runtime
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 13, 2022 · Fundamentals

Understanding ECMAScript Runtime Semantics, Algorithm Steps, and Abstract Operations

This article explains ECMAScript runtime semantics, detailing how algorithm steps and abstract operations such as ToBoolean and internal methods like [[GetPrototypeOf]] define JavaScript's execution behavior, and introduces related concepts like internal slots, completion records, and shorthand notations used in the specification.

Abstract OperationsAlgorithm StepsECMAScript
0 likes · 14 min read
Understanding ECMAScript Runtime Semantics, Algorithm Steps, and Abstract Operations
21CTO
21CTO
Oct 12, 2022 · Frontend Development

Why Axios v1.1.0 Broke Thousands of Sites and How to Fix It

An overview of the Axios 1.1.0 release bug that corrupted the package, caused axios.get to become undefined in browsers, and the quick patches (v1.1.1, v1.1.2) that resolved the issue for developers worldwide.

HTTP clientJavaScriptVersion 1.1.0
0 likes · 4 min read
Why Axios v1.1.0 Broke Thousands of Sites and How to Fix It
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 12, 2022 · Frontend Development

Implementing a Simple Micro‑Application Loader with Qiankun: Code Walkthrough and Sandbox Isolation

This tutorial demonstrates how to build a lightweight function that loads a micro‑application by fetching its HTML, converting external CSS links to inline styles, applying scoped CSS isolation, executing JavaScript within a snapshot sandbox, and discusses entry‑point handling, isolation limitations, and routing integration.

JavaScriptSandboxcss isolation
0 likes · 13 min read
Implementing a Simple Micro‑Application Loader with Qiankun: Code Walkthrough and Sandbox Isolation
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 12, 2022 · Frontend Development

Implementing a Simplified Qiankun JavaScript Sandbox: Snapshot, Singular Proxy, and Multiple Proxy Sandboxes

This article walks through building a lightweight Qiankun JS sandbox by first explaining sandbox principles, then creating a snapshot sandbox, a singular proxy sandbox that records changes via ES6 Proxy, and finally a multiple‑proxy sandbox that isolates each micro‑frontend with its own fake window, complete with test cases and setup instructions.

JavaScriptJestMicro Frontends
0 likes · 16 min read
Implementing a Simplified Qiankun JavaScript Sandbox: Snapshot, Singular Proxy, and Multiple Proxy Sandboxes
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 11, 2022 · Frontend Development

Deep Dive into Vue Router 4 Navigation Guard Source Code

This article thoroughly explains the core mechanisms of Vue Router 4 navigation guards, covering global, per‑route, and component guards, their classification, execution flow, and the underlying source‑code implementations such as useCallbacks, guardToPromiseFn, and runGuardQueue.

JavaScriptNavigation GuardRouting
0 likes · 13 min read
Deep Dive into Vue Router 4 Navigation Guard Source Code
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 11, 2022 · Frontend Development

Testing React Hooks with Jest and React Testing Library

This article provides a comprehensive guide on unit testing custom React Hooks using Jest, renderHook, act, and the React Testing Library, covering examples such as useCounter, useEventListener, useHover, and useMouse with detailed code snippets and best‑practice recommendations.

HooksJavaScriptJest
0 likes · 16 min read
Testing React Hooks with Jest and React Testing Library
21CTO
21CTO
Oct 10, 2022 · Information Security

Top 10 Programming Languages Every Cybersecurity Professional Should Master

This article introduces the ten most important programming languages for cybersecurity, explains why each language matters, and shows how mastering them can boost your ability to protect systems, detect threats, and build secure applications in an increasingly digital world.

C++JavaScriptProgramming Languages
0 likes · 10 min read
Top 10 Programming Languages Every Cybersecurity Professional Should Master
37 Interactive Technology Team
37 Interactive Technology Team
Oct 10, 2022 · Frontend Development

AOP Techniques for Ajax and Jsonp in Front-End Development

The article explains how to use Aspect‑Oriented Programming to globally intercept and rewrite Ajax and JSONP requests—both native and framework based—by extending Function.prototype, overriding DOM methods, and employing ajax‑hook and Axios interceptors, culminating in a runnable demo that redirects traffic from a‑domain to b‑domain.

AJAXAOPJSONP
0 likes · 19 min read
AOP Techniques for Ajax and Jsonp in Front-End Development
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 10, 2022 · Frontend Development

Pure Functions in JavaScript: Concepts, Benefits, and Practical Examples

This article explains the definition of pure functions in JavaScript, illustrates their input‑output behavior, side‑effects, composition, point‑free style, and monadic encapsulation, and demonstrates how writing pure functions improves readability, testability, and refactoring with concrete code examples.

Code RefactoringFunctional ProgrammingJavaScript
0 likes · 15 min read
Pure Functions in JavaScript: Concepts, Benefits, and Practical Examples
HelloTech
HelloTech
Oct 9, 2022 · Frontend Development

Understanding Vue2 and Vue3 Diff Algorithms: Core Principles and Process

The article explains how Vue 2’s diff algorithm uses head‑to‑tail comparisons and a key‑to‑index map to patch, add, or remove nodes, while Vue 3 improves efficiency by building a key‑to‑new‑index map, computing the longest increasing subsequence, and moving only non‑LIS nodes, reducing DOM operations.

Diff AlgorithmJavaScriptVirtual DOM
0 likes · 22 min read
Understanding Vue2 and Vue3 Diff Algorithms: Core Principles and Process
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 8, 2022 · Fundamentals

Understanding ECMAScript Runtime Semantics, Algorithm Steps, and Abstract Operations

This article explains ECMAScript runtime semantics, the structure of algorithm steps, abstract operations, internal methods and slots, as well as completion records and the shorthand symbols ? and ! used in the specification, providing clear examples and code snippets for JavaScript developers.

Abstract OperationsAlgorithm StepsECMAScript
0 likes · 14 min read
Understanding ECMAScript Runtime Semantics, Algorithm Steps, and Abstract Operations
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 8, 2022 · Frontend Development

Understanding the Singleton Pattern in JavaScript: Concepts, Implementations, and Real‑World Applications

This article explains the singleton design pattern, shows standard and lazy implementations in JavaScript with code examples, discusses reducing global variable pollution, and demonstrates practical usage in popular front‑end libraries such as Vuex, Ant Design message, and Axios request cancellation.

Design PatternJavaScriptLazy Initialization
0 likes · 11 min read
Understanding the Singleton Pattern in JavaScript: Concepts, Implementations, and Real‑World Applications
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 8, 2022 · Operations

Complete Solution for Sentry Error and Performance Monitoring in Qiankun Micro‑Frontend Architecture

This article presents a complete solution for routing Sentry error and performance data to the correct micro‑frontend projects in a Qiankun architecture by intercepting transport, redistributing URLs, and distinguishing transaction types, with detailed code examples for both Sentry 6.x and 7.x versions.

JavaScriptMicro‑frontendPerformance Monitoring
0 likes · 10 min read
Complete Solution for Sentry Error and Performance Monitoring in Qiankun Micro‑Frontend Architecture
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 8, 2022 · Frontend Development

Cross‑Platform Plugin Development for Productivity Tools: Core Module Design and Platform Adaptation

The article examines how to boost personal efficiency by developing cross‑platform plugins for macOS productivity tools such as Alfred, Raycast, and uTools, describing their architectures, a shared core module, the use of the lightweight txiki.js runtime, and practical implementation details.

AlfredJavaScriptRaycast
0 likes · 8 min read
Cross‑Platform Plugin Development for Productivity Tools: Core Module Design and Platform Adaptation
Sohu Tech Products
Sohu Tech Products
Oct 7, 2022 · Frontend Development

How GOV.UK Removed jQuery and Measured Its Performance Impact

In March, the UK government’s GOV.UK site eliminated jQuery from all front‑end applications, detailing the reasons, the removal process, and the resulting performance gains for users, especially on low‑spec devices, through extensive lab testing and real‑user monitoring.

GOV.UKJavaScriptfrontend
0 likes · 7 min read
How GOV.UK Removed jQuery and Measured Its Performance Impact
ELab Team
ELab Team
Sep 30, 2022 · Frontend Development

Mastering WebRTC: From RTMP/HLS Basics to Real-Time Audio‑Video Communication

This article explains common audio‑video streaming protocols such as RTMP and HLS, compares their use cases, then dives into WebRTC fundamentals, device detection, media capture, recording, connection setup, codec considerations, and how to display remote streams, providing a comprehensive guide for building real‑time web communication applications.

JavaScriptReal‑time communicationWebRTC
0 likes · 22 min read
Mastering WebRTC: From RTMP/HLS Basics to Real-Time Audio‑Video Communication
ByteFE
ByteFE
Sep 30, 2022 · Frontend Development

Curated Technical Reads: WebAssembly Runtime, JavaScript Frameworks, Component Preview, Web 3D, CSS Transform, JS Utility Methods, and CesiumJS

This newsletter curates a selection of technical articles covering custom WebAssembly JavaScript runtimes, the evolution of JavaScript frameworks competing with native SDKs, fast component preview and debugging, an introduction to Web 3D graphics, the new CSS transform individual property, essential JavaScript utility methods, and an overview of CesiumJS for 3D earth visualization.

CSSCesiumJSJavaScript
0 likes · 6 min read
Curated Technical Reads: WebAssembly Runtime, JavaScript Frameworks, Component Preview, Web 3D, CSS Transform, JS Utility Methods, and CesiumJS
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 30, 2022 · Frontend Development

Enhanced ES‑Check Implementation with Multi‑File Detection, HTML Support, and SourceMap Parsing

This article examines existing ES‑check tools, compares community and mpx implementations, and presents a comprehensive enhanced version that supports multi‑file detection, HTML parsing, source‑map resolution, and both CLI and library usage, detailing its underlying principles, code examples, and practical advantages for frontend development.

BabelCLIJavaScript
0 likes · 20 min read
Enhanced ES‑Check Implementation with Multi‑File Detection, HTML Support, and SourceMap Parsing
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 29, 2022 · Frontend Development

Understanding Web Performance Metrics and Implementing Monitoring with Sentry

This article explains the key web performance indicators such as FP, FCP, LCP, TTI, TBT, FID, CLS, how to obtain them using the Performance API and PerformanceObserver, and provides step‑by‑step guidance on configuring Sentry for automated performance monitoring, including sample JavaScript code for custom calculations.

JavaScriptSentryWeb Performance
0 likes · 22 min read
Understanding Web Performance Metrics and Implementing Monitoring with Sentry
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 29, 2022 · Frontend Development

Deep Dive into Vue Router 4: createWebHistory, Web History API, and Source Code Analysis

This article explains how Vue Router 4 leverages the HTML5 Web History API through createWebHistory, detailing pushState/replaceState mechanics, server fallback handling, TypeScript definitions, the four‑step creation process, listener implementation, and comparisons with hash and memory histories, all illustrated with real source code.

JavaScriptVue RouterWeb History API
0 likes · 20 min read
Deep Dive into Vue Router 4: createWebHistory, Web History API, and Source Code Analysis
Sohu Tech Products
Sohu Tech Products
Sep 28, 2022 · Frontend Development

Using JavaScript Blob, File, FileReader, ArrayBuffer, DataView, Object URL and Base64 APIs

This article explains how JavaScript’s Blob, File, FileReader, ArrayBuffer, DataView, Object URL and Base64 APIs work together to create, slice, read, convert and display binary data in web applications, providing code examples for each operation and detailing their properties, methods, and typical use‑cases.

ArrayBufferBLOBFileReader
0 likes · 23 min read
Using JavaScript Blob, File, FileReader, ArrayBuffer, DataView, Object URL and Base64 APIs
Liangxu Linux
Liangxu Linux
Sep 27, 2022 · Frontend Development

Explore 4 Must‑Try Open‑Source JavaScript Tools by Alyssa

This article introduces four open‑source JavaScript projects—Screenity, Omni, Mapus, and Flowy—detailing their features, usage, and GitHub repositories, providing developers with powerful tools for screen recording, browser management, collaborative mapping, and flowchart creation.

Browser pluginChrome ExtensionFlowchart Library
0 likes · 6 min read
Explore 4 Must‑Try Open‑Source JavaScript Tools by Alyssa
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 27, 2022 · Frontend Development

Understanding Closures and Currying in JavaScript: Functional Programming Essentials

This article explains how closures and currying form the core of JavaScript functional programming, demonstrates multiple curry implementations, shows practical uses such as argument caching, debounce/throttle, and lodash utilities, and highlights their relevance for front‑end developer interviews.

CurryingFunctional ProgrammingHigher-Order Functions
0 likes · 14 min read
Understanding Closures and Currying in JavaScript: Functional Programming Essentials
Huolala Tech
Huolala Tech
Sep 27, 2022 · Frontend Development

How to Build a Custom ESLint Rule to Rewrite Import Paths

This tutorial explains why and how to create a custom ESLint rule that automatically replaces specified import paths, using AST traversal, rule configuration, and fixers, with a complete example including project scaffolding, implementation details, and unit testing.

ASTESLintJavaScript
0 likes · 8 min read
How to Build a Custom ESLint Rule to Rewrite Import Paths
KooFE Frontend Team
KooFE Frontend Team
Sep 25, 2022 · Frontend Development

Mastering Array.fromAsync: Async Iteration Made Easy in JavaScript

This article introduces the Stage‑3 ECMAScript proposal Array.fromAsync, explains why it’s needed for async iterables, shows its usage with async, sync, and array‑like inputs, provides real‑world examples, and offers a polyfill implementation for current environments.

Array.fromAsyncJavaScriptPolyfill
0 likes · 9 min read
Mastering Array.fromAsync: Async Iteration Made Easy in JavaScript
ELab Team
ELab Team
Sep 24, 2022 · Frontend Development

Building a Tiny Custom JavaScript Runtime with Duktape and WebAssembly

This article explains how to create a lightweight, embeddable JavaScript runtime using Duktape, compile it to WebAssembly, expose custom APIs, and integrate it into a web-based login greeter, highlighting implementation steps, code examples, and potential use cases.

DuktapeJavaScriptWebAssembly
0 likes · 8 min read
Building a Tiny Custom JavaScript Runtime with Duktape and WebAssembly
ByteFE
ByteFE
Sep 23, 2022 · Frontend Development

Curated Technical Articles: Productivity, Memory Leak Detection, Rust Challenges, Frontend Innovations, and More

This curated collection presents insights on engineering productivity, JavaScript memory leak detection with MemLab, Rust's top challenges, V8 execution, advanced frontend tools like Lath and Plasmo, Playwright component testing, senior engineering perspectives, and practical guides on proxy patterns and Babel plugins.

JavaScriptRustV8
0 likes · 7 min read
Curated Technical Articles: Productivity, Memory Leak Detection, Rust Challenges, Frontend Innovations, and More
TAL Education Technology
TAL Education Technology
Sep 23, 2022 · Backend Development

Embedding Grafana Monitoring in Backend with API Key, Anonymous Login, and Cookie Methods

This guide explains how to embed Grafana monitoring pages into a backend system and compares three authentication approaches—anonymous login, API‑key based login, and cookie‑based simulated login—providing configuration examples, curl commands, Nginx settings, and JavaScript tweaks to improve the user experience.

API KeyBackend IntegrationGrafana
0 likes · 10 min read
Embedding Grafana Monitoring in Backend with API Key, Anonymous Login, and Cookie Methods
Alibaba Terminal Technology
Alibaba Terminal Technology
Sep 22, 2022 · Frontend Development

Why “Script Error.” Happens and How to Fix It in Modern Browsers

This article explains the origins of the generic “Script Error.” message, why browsers hide details due to same‑origin policy, and offers practical solutions such as using the crossorigin attribute, CSP reporting, and systematic approaches adopted by major companies to handle script errors effectively.

CSPJavaScriptcrossorigin
0 likes · 10 min read
Why “Script Error.” Happens and How to Fix It in Modern Browsers
DaTaobao Tech
DaTaobao Tech
Sep 20, 2022 · Frontend Development

Understanding Intersection Observer API and Its Polyfill Implementation

The article explains how the Intersection Observer API offloads visibility detection from scroll events to improve performance, details its creation, options, callback structure, and entry data, and describes a polyfill that mimics native behavior using event listeners, mutation observers, and geometric calculations for broader browser support.

IntersectionObserverJavaScriptPerformance
0 likes · 16 min read
Understanding Intersection Observer API and Its Polyfill Implementation
ByteFE
ByteFE
Sep 19, 2022 · Frontend Development

Comprehensive Guide to Babel: History, Configuration, Plugins, Presets, Runtime and Webpack Integration

This article provides an in‑depth overview of Babel, covering its origins, core purpose as a JavaScript compiler, configuration file options, plugin and preset usage, runtime optimization, integration with webpack, and the underlying parsing‑transform‑generation pipeline illustrated with a simple compiler example.

BabelJavaScriptcompiler
0 likes · 30 min read
Comprehensive Guide to Babel: History, Configuration, Plugins, Presets, Runtime and Webpack Integration
IT Services Circle
IT Services Circle
Sep 19, 2022 · Frontend Development

12 Notable Open‑Source WeChat Mini‑Program Projects for Developers

This article presents a curated collection of twelve noteworthy open‑source WeChat mini‑program projects—including e‑commerce, UI component libraries, music, library, and development frameworks—detailing their main features, GitHub stars, and links to help developers explore and learn from real‑world examples.

JavaScriptMiniProgramOpenSource
0 likes · 10 min read
12 Notable Open‑Source WeChat Mini‑Program Projects for Developers
JavaScript
JavaScript
Sep 16, 2022 · Frontend Development

Essential New JavaScript Features to Boost Your Code in 2024

Discover the latest JavaScript enhancements—including class member addition, private property checks with the in operator, top‑level await, error.cause for root causes, the .at() method for strings, arrays, and array‑like objects, and the safer Object.hasOwn method—each designed to streamline modern development.

ES2022JavaScriptLanguage Features
0 likes · 1 min read
Essential New JavaScript Features to Boost Your Code in 2024
Bilibili Tech
Bilibili Tech
Sep 16, 2022 · Frontend Development

Understanding contenteditable and Modern Rich Text Editors with Slate.js

The article explains how the HTML contenteditable attribute enables in‑place editing, why legacy execCommand‑based editors are inconsistent, and how modern frameworks such as Slate.js—built on React and Immutable.js—provide a structured, location‑based data model with Transform and Node APIs for reliable, portable rich‑text editing.

JavaScriptReActSlate.js
0 likes · 12 min read
Understanding contenteditable and Modern Rich Text Editors with Slate.js
21CTO
21CTO
Sep 11, 2022 · Fundamentals

From Mocha to Modern Web: 27 Years of JavaScript Evolution

This article chronicles JavaScript's 27‑year journey from its rapid 1995 creation at Netscape, through browser wars, standardization, the rise of frameworks and Node.js, to its current dominance and promising future with WebAssembly and beyond.

ECMAScriptJavaScript
0 likes · 11 min read
From Mocha to Modern Web: 27 Years of JavaScript Evolution
DaTaobao Tech
DaTaobao Tech
Sep 9, 2022 · Frontend Development

Getting Started with WebXR and AR using A‑Frame and Mind‑AR

This guide introduces WebXR’s 3DoF/6DoF concepts, walks through building a basic A‑Frame scene, then shows how to add Mind‑AR face‑tracking with WebAssembly, WebGL2/WebGPU and event listeners, and even wraps it in a React component, outlining the three core steps for creating performant web‑based AR experiences.

A-FrameARJavaScript
0 likes · 14 min read
Getting Started with WebXR and AR using A‑Frame and Mind‑AR
php Courses
php Courses
Sep 7, 2022 · Frontend Development

Understanding JavaScript this Binding Rules and Their Priorities

This article explains the four JavaScript this‑binding rules—default, implicit, explicit (call/apply/bind), and new—illustrates each with code examples, compares their precedence, and shows how arrow functions affect this binding in modern ES6 code.

BINDJavaScript__call__
0 likes · 11 min read
Understanding JavaScript this Binding Rules and Their Priorities
21CTO
21CTO
Sep 5, 2022 · Fundamentals

Who Owns the JavaScript Trademark? The Untold Story Behind Oracle’s Claim

This article traces the history of the JavaScript trademark—from its creation by Netscape and Sun, through Oracle’s acquisition, to Ryan Dahl’s 2022 open letter urging its release, highlighting the confusion with Java and the rise of ECMAScript as a neutral name.

ECMAScriptJavaScriptOracle
0 likes · 5 min read
Who Owns the JavaScript Trademark? The Untold Story Behind Oracle’s Claim
ELab Team
ELab Team
Sep 2, 2022 · Backend Development

How to Build a Minimal Mocha Test Runner from Scratch

This article walks through the design and implementation of a lightweight Mocha-like test framework for Node.js, covering automated testing concepts, core functions, asynchronous support, suite‑test tree construction, result collection, and verification with code examples and diagrams.

AutomationJavaScriptNode.js
0 likes · 26 min read
How to Build a Minimal Mocha Test Runner from Scratch
Tencent Cloud Developer
Tencent Cloud Developer
Sep 2, 2022 · Frontend Development

Understanding Vite's Dependency Scanning and Pre‑Bundling Process

Vite improves dev‑server startup and runtime speed by scanning every project HTML file (excluding node_modules) with an esbuild plugin that traverses the module graph, classifies JavaScript, assets, bare imports and framework files, creates virtual modules, and records each bare import’s actual path for pre‑bundling.

Dependency ScanningHTMLJavaScript
0 likes · 18 min read
Understanding Vite's Dependency Scanning and Pre‑Bundling Process
JavaScript
JavaScript
Sep 1, 2022 · Backend Development

What Makes Bun the Next‑Generation JavaScript Runtime?

Bun is a modern JavaScript runtime built on WebKit’s JavaScriptCore instead of V8, backed by $7 million funding, and its creators aim to release a stable version within six months, positioning it as a potential alternative to Node and Deno.

BunJavaScriptNode alternative
0 likes · 1 min read
What Makes Bun the Next‑Generation JavaScript Runtime?
Laravel Tech Community
Laravel Tech Community
Aug 31, 2022 · Frontend Development

Chrome 105 New Features: Blocking Rendering, :has() Selector, onbeforeinput Event, 125 Hz Timer Alignment, CSS :modal, Identifier Restrictions, Container Queries, Scroll & Fetch Enhancements, Gesture‑Scroll Events

Chrome 105 introduces 25 new web‑development features—including a blocking=rendering attribute for scripts and styles, the :has() selector, onbeforeinput event, 125 Hz timer alignment, CSS :modal pseudo‑class, restrictions on the default identifier, container queries, enhanced scroll and fetch APIs, and experimental gesture‑scroll DOM events.

Browser FeaturesCSSChrome
0 likes · 6 min read
Chrome 105 New Features: Blocking Rendering, :has() Selector, onbeforeinput Event, 125 Hz Timer Alignment, CSS :modal, Identifier Restrictions, Container Queries, Scroll & Fetch Enhancements, Gesture‑Scroll Events