Click follow to learn the latest frontend insights in the cultural content industry. We welcome you to join us.
This article uses physical analogies to explain why converting design drafts to web prototypes is challenging, clarifies the box model, positioning, and floating concepts, and shows how to visualize CSS layout as a three‑dimensional structure for more intuitive front‑end development.
This article explains how Webnovel integrated Google AMP WebPackage and Signed HTTP Exchanges (SXG) to keep its own domain visible in search results, detailing the background, implementation steps, server configuration, and the performance impact of the solution.
This article explores how to design and extend button components effectively by emphasizing early communication with designers, strategic naming conventions based on location, color, or function, and practical CSS architecture—including themes, sizes, shapes, states, and code examples—to achieve scalable and maintainable UI solutions.
Webnovel’s overseas project recently added Indonesian, Malay, and Filipino support, prompting a deep dive into internationalization challenges such as pluralization, rich‑text handling, date and currency formatting, and translation workflows, and the article details practical solutions using ICU MessageFormat, ECMAScript Intl APIs, and custom React libraries.
This article explains why an MP4 video can trigger three separate network requests in browsers, how the placement of the moov box causes the issue, and provides practical steps using HandBrake or ffmpeg to reposition the moov box so only a single request is needed.
This article explains how JavaScript execution contexts and the call stack work, covering their types, creation and execution phases, this binding, lexical and variable environments, and includes code examples to illustrate these core concepts for developers.
This article explains ES6 JavaScript generators, covering their syntax, how they differ from regular iterators, the role of the yield keyword, available generator methods, and practical examples such as custom generators, random number streams, throttling, Fibonacci sequences, and integrating generators with HTML to simplify iterative tasks.
This article explains how to improve web application performance by leveraging persistent caching with proper cache‑control headers, versioning bundles using hash‑based filenames, extracting dependencies and runtime into separate chunks, inlining runtime scripts, applying lazy loading with dynamic imports, splitting code by routes or pages, and stabilizing module IDs with hashed IDs, all using webpack configurations for both version 3 and 4.
This article explains why web push notifications stop working when the browser is closed, how Android and desktop browsers handle push messages, how to open added‑to‑desktop web apps in full‑screen, the evolution from GCM to FCM, and provides detailed troubleshooting steps for authorization, payload encryption, connection issues, HTTP status codes, and error reporting.
This article explains how push messages trigger a push event in a service worker, how to access event data, use event.waitUntil to keep the worker alive, and how to configure and display rich notifications with icons, images, actions, vibration, and best‑practice tips across browsers.
