Tagged articles
51 articles
Page 1 of 1

HTML‑in‑Canvas Lets Browsers Render Games and Doom‑Style Effects

HTML‑in‑Canvas is an experimental Web API that captures HTML elements as images and draws them onto a canvas, giving developers pixel‑level control to create game‑like UI effects, dynamic layouts, and even embed live web content inside classic games like Doom, while the proposal advances through W3C.

AICanvasHTML-in-Canvas
0 likes · 9 min read
HTML‑in‑Canvas Lets Browsers Render Games and Doom‑Style Effects
Data STUDIO
Data STUDIO
Mar 18, 2026 · Artificial Intelligence

Building a Smart Web AI Agent with FastAPI, LangGraph, and MCP

This article walks through the design and implementation of a production‑ready Web AI agent that uses FastAPI as the HTTP layer, LangGraph to orchestrate multi‑step reasoning, and MCP to expose external tools, showing how to manage state, integrate multiple LLM providers, and extend the system with persistence, rate‑limiting, and monitoring.

AI AgentFastAPILLM
0 likes · 20 min read
Building a Smart Web AI Agent with FastAPI, LangGraph, and MCP
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Mar 17, 2026 · Frontend Development

Chrome’s AI‑Powered WebMCP: A New Era for Front‑End Development

Chrome’s new WebMCP API lets AI agents bypass visual UI simulation and interact directly with web pages via a single navigator.modelContext call, eliminating fragile screen‑scraping tricks and enabling front‑end developers to expose structured tools to AI using simple declarative or imperative JavaScript APIs.

AI agentsChromeDeclarative API
0 likes · 8 min read
Chrome’s AI‑Powered WebMCP: A New Era for Front‑End Development
JavaScript
JavaScript
Jul 19, 2025 · Frontend Development

How to Reliably Send Data When Users Close a Page: sendBeacon vs fetch keepalive

This article explains why traditional fetch or XMLHttpRequest calls often fail during page unload, and demonstrates two modern browser APIs—navigator.sendBeacon and fetch with keepalive:true—that reliably transmit analytics or draft data without blocking the user experience.

JavaScriptWeb APIfetch keepalive
0 likes · 7 min read
How to Reliably Send Data When Users Close a Page: sendBeacon vs fetch keepalive
JavaScript
JavaScript
Jul 12, 2025 · Frontend Development

How to Build a Browser Screen Recorder with the MediaRecorder API

This guide explains how to use the native MediaRecorder API to capture screen, audio, or canvas streams in the browser, walk through a three‑step implementation—getting the stream, recording it, and handling the output—and shares best practices for compatibility, MIME types, user permissions, resource cleanup, and performance.

BrowserJavaScriptMediaRecorder
0 likes · 7 min read
How to Build a Browser Screen Recorder with the MediaRecorder API
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jun 15, 2025 · Frontend Development

Master Cross‑Tab Communication: BroadcastChannel vs localStorage in JavaScript

Learn how to synchronize data across multiple browser tabs using the native BroadcastChannel API and the fallback localStorage + storage event, with step‑by‑step code examples, usage scenarios, feature comparisons, compatibility notes, and a reusable TabMessenger class for seamless inter‑tab messaging.

BroadcastChannelJavaScriptWeb API
0 likes · 9 min read
Master Cross‑Tab Communication: BroadcastChannel vs localStorage in JavaScript
Code Mala Tang
Code Mala Tang
Apr 24, 2025 · Backend Development

Mastering Dependency Injection in FastAPI: From Basics to Advanced Use

This article explains how FastAPI leverages Dependency Injection to improve code reusability, modularity, and testability, covering basic examples, sub‑dependency handling, database session management with SQLAlchemy, and building a full‑featured user management API with authentication.

Backend DevelopmentFastAPIPython
0 likes · 9 min read
Mastering Dependency Injection in FastAPI: From Basics to Advanced Use
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Feb 6, 2025 · Frontend Development

Chrome Introduces the New moveBefore DOM API

Chrome 133+ adds the moveBefore method, a new DOM operation that moves elements while preserving their state, offering developers a simpler alternative to removeChild/insertBefore and improving scenarios like video playback, focus retention, and animation continuity.

ChromeDOMJavaScript
0 likes · 7 min read
Chrome Introduces the New moveBefore DOM API
Bilibili Tech
Bilibili Tech
Oct 29, 2024 · Frontend Development

WebCodecs Solution Analysis

The article evaluates WebCodecs‑based video editing for browsers, comparing it to cloud and ffmpeg.wasm approaches, and concludes that its low cost and high extensibility outweigh limited ecosystem and compatibility, while outlining the required modules, OPFS storage, frame decoding, and spatial‑temporal manipulation techniques.

Web APIWebCodecsfrontend development
0 likes · 14 min read
WebCodecs Solution Analysis
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Sep 29, 2024 · Frontend Development

Why the AbortController API Is a Game‑Changer for JavaScript

The article shows that the standard AbortController API can do far more than just cancel fetch requests—it can cleanly remove event listeners, combine multiple abort signals, control streams, and even make database transactions cancelable, with concrete code examples and compatibility notes.

AbortControllerAbortSignalJavaScript
0 likes · 13 min read
Why the AbortController API Is a Game‑Changer for JavaScript
21CTO
21CTO
Jul 2, 2024 · Backend Development

FastAPI vs Flask: Why FastAPI Outperforms Flask for Modern APIs

This article compares FastAPI and Flask, highlighting FastAPI's speed, developer experience, and standards support, while providing practical migration guidance, code examples, configuration tips, async handling, dependency injection, testing, deployment, and documentation differences for Python web developers.

ASGIFastAPIFlask
0 likes · 25 min read
FastAPI vs Flask: Why FastAPI Outperforms Flask for Modern APIs
Code Mala Tang
Code Mala Tang
Jun 29, 2024 · Frontend Development

Master WritableStream: Real-World Uses, Best Practices, and Common Pitfalls

This article introduces the JavaScript WritableStream API, explains its core methods and construction, demonstrates practical scenarios such as file uploads, logging, data transformation, and media handling, and discusses advanced considerations like chunk sizing, error recovery, concurrency control, and performance optimization.

StreamingWeb APIWritableStream
0 likes · 10 min read
Master WritableStream: Real-World Uses, Best Practices, and Common Pitfalls
macrozheng
macrozheng
Jun 20, 2024 · Backend Development

What Is the HTTP QUERY Method and How Does It Differ from GET/POST?

This article explains the HTTP QUERY method as a safe, idempotent request type that carries payloads like POST but enables caching and automatic retries, detailing its semantics, caching behavior, Accept-Query header, and providing practical code examples.

HTTPQUERY methodWeb API
0 likes · 10 min read
What Is the HTTP QUERY Method and How Does It Differ from GET/POST?
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 15, 2023 · Frontend Development

Understanding and Using IntersectionObserver for Lazy Loading, Scroll Animations, Infinite Scrolling, and Virtual Lists

This article introduces the IntersectionObserver API, explains its constructor, options, and entry properties, and demonstrates practical applications such as lazy loading images, scroll‑triggered animations, infinite scrolling, and virtual list rendering with complete code examples.

IntersectionObserverScroll AnimationWeb API
0 likes · 11 min read
Understanding and Using IntersectionObserver for Lazy Loading, Scroll Animations, Infinite Scrolling, and Virtual Lists
Sohu Tech Products
Sohu Tech Products
Feb 1, 2023 · Frontend Development

Using the New scrollend Event to Detect When Scrolling Stops

This article explains the newly supported scrollend event, how it replaces unreliable timer‑based scroll‑stop detection, shows practical code examples, lists the conditions under which it fires, discusses browser support, and provides a polyfill for broader compatibility.

JavaScriptWeb APIevent-handling
0 likes · 5 min read
Using the New scrollend Event to Detect When Scrolling Stops
Huolala Tech
Huolala Tech
Oct 25, 2022 · Frontend Development

One‑Click Web Area Screenshot: Using Clipboard API & DOM‑to‑Image

This article explains how to implement a one‑click precise screenshot feature in a web application by leveraging the Clipboard API, converting DOM elements to images via SVG foreignObject, handling styles and resources, and finally writing the image to the system clipboard.

CanvasSVGWeb API
0 likes · 11 min read
One‑Click Web Area Screenshot: Using Clipboard API & DOM‑to‑Image
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.

IntersectionObserverJavaScriptPolyfill
0 likes · 16 min read
Understanding Intersection Observer API and Its Polyfill Implementation
JavaScript
JavaScript
Jul 4, 2022 · Frontend Development

How to Keep Mobile Screens Awake with JavaScript Wake Lock API

This guide explains how to use the modern Wake Lock Web API in JavaScript to prevent a mobile screen from sleeping, covering feature detection, requesting and releasing the lock, handling release events, and automatically reacquiring the lock when the page becomes visible again.

JavaScriptScreen AwakeWake Lock
0 likes · 3 min read
How to Keep Mobile Screens Awake with JavaScript Wake Lock API
Sohu Tech Products
Sohu Tech Products
Apr 27, 2022 · Fundamentals

Understanding the ShadowRealm API: Isolated JavaScript Realms and Their Usage

The article introduces the ShadowRealm API, a new JavaScript proposal that creates highly isolated execution realms, explains its type signatures, demonstrates .evaluate() and .importValue() methods with code examples, compares it to eval, Function, iframes, Web Workers, and Node.js vm, and outlines practical use cases such as plugin execution, testing, and web scraping.

IsolationJavaScriptSecurity
0 likes · 9 min read
Understanding the ShadowRealm API: Isolated JavaScript Realms and Their Usage
IT Services Circle
IT Services Circle
Apr 14, 2022 · Frontend Development

Understanding the ShadowRealm API: Isolated JavaScript Execution Environments

This article introduces the ShadowRealm API, a new JavaScript proposal that creates independent, highly isolated realms for executing code, explains its type signatures, demonstrates .evaluate() and .importValue() methods with practical examples, and compares it with eval, Web Workers, iframes, and Node.js vm.

IsolationJavaScriptRuntime
0 likes · 10 min read
Understanding the ShadowRealm API: Isolated JavaScript Execution Environments
Programmer DD
Programmer DD
Jan 20, 2022 · Backend Development

Why FastAPI Is the Fastest Way to Build High‑Performance Python APIs

FastAPI is a high‑performance, easy‑to‑learn Python web framework that lets you build robust APIs quickly, offering features like speed, concise code, automatic validation, and OpenAPI compatibility, with simple installation via pip and interactive documentation out of the box.

ASGIBackend DevelopmentFastAPI
0 likes · 4 min read
Why FastAPI Is the Fastest Way to Build High‑Performance Python APIs
ByteFE
ByteFE
Aug 18, 2021 · Frontend Development

Understanding and Using the Intersection Observer API for Visibility Detection in Frontend Development

This article explains the purpose, core concepts, configuration options, callback handling, and practical use‑cases of the Intersection Observer API—such as lazy loading, infinite scrolling, sticky headers, and analytics—while providing complete Vue 3 code examples and compatibility notes.

IntersectionObserverSticky HeaderVisibility Detection
0 likes · 21 min read
Understanding and Using the Intersection Observer API for Visibility Detection in Frontend Development
php Courses
php Courses
Nov 12, 2020 · Frontend Development

Understanding Node, Element, NodeList, and HTMLCollection in the DOM

This article explains the differences between Node and Element in the DOM, clarifies the roles of NodeList and HTMLCollection, demonstrates how to inspect child nodes with code examples, and provides practical tips for handling these objects in frontend development.

DOMElementJavaScript
0 likes · 4 min read
Understanding Node, Element, NodeList, and HTMLCollection in the DOM
Sohu Tech Products
Sohu Tech Products
Jul 15, 2020 · Frontend Development

Understanding and Using the Blob Web API in JavaScript

This article explains what a Blob is, introduces the Blob Web API with its constructor, properties, and methods, and demonstrates practical scenarios such as chunked uploads, downloading data, creating Blob URLs, converting to Base64, image compression, PDF generation, and compares Blob with ArrayBuffer, providing complete code examples for each use case.

Base64BlobFile
0 likes · 20 min read
Understanding and Using the Blob Web API in JavaScript
WecTeam
WecTeam
Nov 14, 2019 · Frontend Development

Unlocking Intersection Observer: Deep Dive, Performance Tests & Advanced Tricks

This comprehensive guide explores the Intersection Observer API, explaining its core concepts, detailed code examples, performance comparisons with scroll events, advanced usage like sticky positioning, visibility tracking, and browser compatibility, providing developers with practical insights to efficiently implement and optimize intersection-based interactions.

IntersectionObserverJavaScriptWeb API
0 likes · 32 min read
Unlocking Intersection Observer: Deep Dive, Performance Tests & Advanced Tricks
360 Tech Engineering
360 Tech Engineering
Aug 13, 2019 · Backend Development

Design and Implementation of a Web Interface Mock Service at Huajiao

This article explains the concept of Mock objects for testing, outlines why interface mocking is essential in web development, and details Huajiao's comprehensive Mock solution—including a SpringBoot‑based backend, MySQL data storage, Nginx redirection, and Lua scripts for dynamic request routing—providing step‑by‑step usage instructions and code examples.

Backend DevelopmentMockWeb API
0 likes · 13 min read
Design and Implementation of a Web Interface Mock Service at Huajiao
AutoHome Frontend
AutoHome Frontend
Aug 1, 2019 · Frontend Development

8 Hidden DOM Features You Didn’t Know Exist (And How to Use Them)

This article reveals eight lesser‑known DOM and Web API features—such as addEventListener options, smooth scrollTo, optional timer arguments, defaultChecked, normalize/wholeText, insertAdjacent methods, event.detail, and scrollHeight/scrollWidth—explaining their purpose, browser support, and providing practical code examples.

DOMJavaScriptWeb API
0 likes · 17 min read
8 Hidden DOM Features You Didn’t Know Exist (And How to Use Them)
360 Tech Engineering
360 Tech Engineering
Mar 1, 2019 · Frontend Development

What is the Screen Orientation API and How to Use It

The Screen Orientation API lets web applications read the device's current screen direction and angle, lock the orientation, and listen for changes, providing code examples, property details, and browser support guidance for enhancing user experience on video and gaming sites.

Lock ScreenScreen Orientation APIWeb API
0 likes · 5 min read
What is the Screen Orientation API and How to Use It
360 Tech Engineering
360 Tech Engineering
Jan 10, 2019 · Frontend Development

Understanding Clipboard Operations: clipboard.js and the Async Clipboard API

This article explains the system‑level nature of the clipboard, analyzes how clipboard.js implements copy via a hidden textarea and execCommand, discusses its limitations, and introduces the modern Async Clipboard API with its Promise‑based read/write methods, usage notes, and browser support.

Async Clipboard APIWeb APIclipboard
0 likes · 9 min read
Understanding Clipboard Operations: clipboard.js and the Async Clipboard API
Qunar Tech Salon
Qunar Tech Salon
Dec 21, 2018 · Frontend Development

Using Web Share Target API to Receive Shared Content on Websites

This article explains how to register a website as a share target using the Web Share Target API, update the manifest file, handle incoming shared data with JavaScript, and outlines browser support, usage scenarios, and example implementations for modern front‑end development.

JavaScriptProgressive Web AppWeb API
0 likes · 7 min read
Using Web Share Target API to Receive Shared Content on Websites
UC Tech Team
UC Tech Team
Oct 31, 2018 · Frontend Development

Implementing Picture-in-Picture (PiP) with the Web API

This article explains how to use the new Picture-in-Picture Web API to enable floating video playback on web pages, covering setup of video and button elements, request handling, error management, event listeners, window‑size tracking, feature detection, and best‑practice UI considerations.

HTML5JavaScriptPicture-in-Picture
0 likes · 8 min read
Implementing Picture-in-Picture (PiP) with the Web API
Java Captain
Java Captain
Aug 25, 2018 · Blockchain

Implementing a Simple Blockchain in Java with Web API Endpoints

This tutorial walks through building a simple blockchain in Java, covering core concepts, block and transaction structures, proof‑of‑work implementation, and exposing API endpoints via Servlets for creating transactions, mining blocks, viewing the chain, and achieving consensus across nodes.

BlockchainConsensusDistributed Systems
0 likes · 27 min read
Implementing a Simple Blockchain in Java with Web API Endpoints
ITFLY8 Architecture Home
ITFLY8 Architecture Home
Apr 2, 2018 · Backend Development

Mastering Web API Design: A 7‑Step Methodology for Robust Services

This article outlines a practical seven‑step methodology for designing, documenting, and publishing Web APIs—covering everything from listing semantic descriptors and drawing state diagrams to harmonizing names, choosing media types, creating semantic profiles, writing code, and finally releasing a stable, consumable service.

MethodologyWeb APIapi-design
0 likes · 15 min read
Mastering Web API Design: A 7‑Step Methodology for Robust Services
21CTO
21CTO
May 22, 2017 · Backend Development

Why Rewriting a Laravel App in Go Boosted Performance and Simplicity

The author rewrote a Laravel‑based Boxzilla application in Go, detailing migration steps, code‑size reduction, benchmark results, and testing advantages, showing how Go delivers faster response times, lower latency, and a more maintainable backend.

Code size reductionGoLaravel migration
0 likes · 7 min read
Why Rewriting a Laravel App in Go Boosted Performance and Simplicity
21CTO
21CTO
Dec 20, 2016 · Backend Development

Why Developers Favor GET & POST Over PUT/DELETE: A Practical Look at RESTful APIs

Although RESTful principles recommend using distinct HTTP verbs for CRUD operations, many developers still rely on GET and POST for creating, updating, and deleting resources, leading to non‑standard JSON APIs; this article explains the HTTP methods, their semantics, and why practical constraints often shape API design.

CRUDHTTPJSON API
0 likes · 5 min read
Why Developers Favor GET & POST Over PUT/DELETE: A Practical Look at RESTful APIs
Java High-Performance Architecture
Java High-Performance Architecture
Nov 26, 2015 · Frontend Development

Understanding Browser Navigation Timing API: All Key Metrics Explained

This article explains the Navigation Timing API's full set of timestamps—from navigationStart to loadEventEnd—detailing each metric's meaning and when it records a value, helping developers diagnose page‑load performance and how they differ for same‑origin versus cross‑origin requests, redirects, and cached resources.

BrowserWeb APIfrontend
0 likes · 4 min read
Understanding Browser Navigation Timing API: All Key Metrics Explained
Art of Distributed System Architecture Design
Art of Distributed System Architecture Design
Mar 3, 2015 · Backend Development

A Seven‑Step Methodology for Designing Web APIs

This article outlines a repeatable, seven‑step process for designing robust Web APIs that leverages both HTTP and broader Web protocols, covering everything from listing semantic descriptors to publishing the API, and emphasizes clear separation of design and implementation details for future extensibility.

MethodologyWeb APIapi-design
0 likes · 18 min read
A Seven‑Step Methodology for Designing Web APIs
Qunar Tech Salon
Qunar Tech Salon
Jan 14, 2015 · Backend Development

A Seven‑Step Methodology for Designing, Implementing, and Maintaining Web APIs

This article presents a comprehensive, seven‑step methodology for designing, implementing, and maintaining Web APIs—covering business use‑case definition, semantic description, state‑diagram modeling, naming harmonization, media‑type selection, semantic archive creation, coding, and publishing—while offering interviews and further reading recommendations.

BackendHTTPMethodology
0 likes · 18 min read
A Seven‑Step Methodology for Designing, Implementing, and Maintaining Web APIs