1 views collected around this technical thread.
This tutorial demonstrates how to use Puppeteer to crawl frontend job postings from the Boss Zhipin website, extract details and job descriptions, and persist the data into a MySQL database through a NestJS application with TypeORM, including Docker setup and optional SSE streaming.
This article explains how to set up and use jest-image-snapshot together with jest-puppeteer to automate visual regression testing for atomic frontend components, covering configuration, code examples, CI integration, and best practices for preventing unintended UI changes.
This article explains what headless browsers are, outlines their advantages and limitations, introduces Puppeteer as a Node.js library for controlling headless Chrome, and provides step‑by‑step code examples for taking screenshots, generating PDFs, and performing automated web interactions.
This article guides front‑end developers through creating a discreet VSCode extension that fetches and displays content such as news or comments, detailing required knowledge, installation steps, key APIs like status bar, commands, quick pick, hover providers, and includes essential code snippets.
This article demonstrates how to use Puppeteer and the Canvas API to automate login on Juejin, extract the slider captcha image, apply grayscale and binarization processing to locate the gap, calculate the required drag distance, and simulate human‑like mouse movements with easing functions for successful verification.
This article explains the overall architecture of Chrome extensions, how to create popup, DevTools, and content scripts using React or Vue, configure manifest.json, set up multi‑entry Webpack builds, debug each component, and perform end‑to‑end testing with Puppeteer and Xvfb for CI environments.
This article details the design and deployment of a unified poster image generation service for the FoxFriend social product, explaining the background, challenges of platform‑specific implementations, the Node.js + Puppeteer solution, architectural flow, engineering stack, performance optimizations, operational results, and future enhancements.
This article introduces Chrome DevTools' experimental Recorder feature, explains what Puppeteer is, provides a step‑by‑step guide to record, edit, import, and export automation scripts, and demonstrates how the generated Puppeteer code can streamline front‑end testing and reduce manual effort.
This article explains how ByteDance’s frontend monitoring SDK is continuously optimized for bundle size and runtime performance through micro‑ and macro‑level code refactoring, benchmark testing with Benny and Puppeteer, and real‑world analysis using Perfsee Lab, ultimately achieving minimal impact on page load metrics.
This article explains how ByteDance's frontend monitoring SDK was systematically reduced in bundle size and runtime overhead through micro‑optimizations such as avoiding long class names, using functional patterns, minimizing polyfills, splitting files, leveraging Puppeteer‑based benchmarks, and applying requestIdleCallback scheduling to improve user experience on both web and mobile platforms.
This article explains how a self‑built performance testing platform leverages data‑statistical models, such as scoring and interval models based on normal distribution and percentile analysis, to quantify web‑page metrics, guide automated and semi‑automated optimizations, and integrate with CI/CD workflows for frontend development.
The article explains the concept of white‑screen time, its impact on user experience, and presents multiple detection methods—including Navigation Timing API, MutationObserver, element‑point analysis, and headless‑browser simulation—along with implementation code and a monitoring‑alert architecture for front‑end performance optimization.
This tutorial explains how to set up and use Puppeteer together with the Mocha test framework to create, run, and report UI automation test cases for web and H5 applications, covering installation, a demo script, selector handling, and visual test reporting.
This article details a compliance‑driven solution that records, replays, and merges user interaction videos across multiple insurance web pages by leveraging rrweb for event capture, Puppeteer for automated playback, and FFmpeg for video stitching, while addressing performance, storage, and privacy challenges.
This article details how the Anjuke mini‑program team tackled frequent, fragmented releases across multiple platforms by standardizing processes, introducing local SDK‑based uploads, integrating Jenkins, and ultimately building a platform‑based service with UI automation using Puppeteer, resulting in reduced cost, higher transparency, and scalable multi‑program support.
This article details a step‑by‑step method for extracting live chat bullet comments from Taobao live streams by analyzing page sources, intercepting the token‑providing API with Puppeteer, establishing a WebSocket connection, and decoding the received base64‑ and GZIP‑compressed messages to retrieve clean usernames and comment texts.
This article explains what skeleton screens are, reviews existing implementation methods, and presents a custom DOM‑based approach with configurable rules, code snippets, and a Puppeteer‑driven CLI tool that automatically generates and injects skeleton screens for web pages.
This article explains how to design and implement a bespoke performance testing platform for web pages using Lighthouse, Puppeteer, and Node.js, covering architecture, data collection, hook functions, gatherer modules, scoring logic, and automated weekly reporting.
The article demonstrates how to use Puppeteer—a Node.js API built on the Chrome DevTools Protocol—to run headless Chrome for tasks such as scraping Google emoji images, generating screenshots or PDFs, and automating front‑end tests by launching a browser, navigating pages, handling cookies, simulating user input, capturing responses, and saving results.
The article details how the Tongtian Tower team adopted Puppeteer for end‑to‑end testing of their web‑based build system, covering technology selection, core concepts, API usage, project architecture, practical challenges, and the measurable efficiency gains achieved through automation.