SourceMap | BestHub

NetEase Cloud Music Tech Team

Jan 24, 2024 · Mobile Development

Optimizing Hermes Bytecode Bundle Size and SourceMap Handling in React Native

To counter the 40‑100 % size increase of Hermes bytecode bundles after upgrading to React Native 0.70, the team switched to xz compression (cutting zip size 20‑26 %), enabled hermesc ‑O optimization (shrinking bundles 10‑22 % while requiring a two‑step source‑map merge), and used the ‑base‑bytecode option with bsdiff to reduce incremental OTA patches by up to 85 %, collectively improving download and update efficiency.

HermesReact NativeSourceMap

0 likes · 13 min read

Optimizing Hermes Bytecode Bundle Size and SourceMap Handling in React Native

360 Quality & Efficiency

Sep 15, 2023 · Frontend Development

Optimizing Webpack Hot Module Replacement Speed: Plugins, Sourcemap, runtimeChunk, and Multi‑Page Strategies

This article explains webpack's hot module replacement mechanism and presents a series of practical optimizations—including disabling CompressionPlugin, selecting fast sourcemap types, configuring runtimeChunk as single, and using babel-plugin-dynamic-import-node—to reduce hot‑update build time from 12 seconds to around 1 second.

Hot Module ReplacementPerformanceSourceMap

0 likes · 9 min read

Optimizing Webpack Hot Module Replacement Speed: Plugins, Sourcemap, runtimeChunk, and Multi‑Page Strategies

ByteFE

Jul 12, 2023 · Fundamentals

WebAssembly Source Debugging: Principles, Tools, and Comparative Analysis

This article introduces the fundamentals of source-level debugging for WebAssembly, explains core debugging principles, discusses native and managed program debugging, examines various debugging information formats such as SourceMap and DWARF, and compares several practical debugging solutions—including Chrome DevTools, LLDB with wasmtime or iwasm, and WasmInspect.

DWARFLLDBSourceMap

0 likes · 20 min read

WebAssembly Source Debugging: Principles, Tools, and Comparative Analysis

Sohu Tech Products

Apr 6, 2023 · Frontend Development

Source Map Usage, Generation Rules, and Integration in Frontend Development

This article explains what source maps are, details their JSON structure, demonstrates how to generate them with Vite and Webpack, discusses choosing appropriate devtool options for development and production, and shows how to make them work in browsers, Sentry, and manual mapping.

SentrySourceMapVite

0 likes · 21 min read

Source Map Usage, Generation Rules, and Integration in Frontend Development

IT Services Circle

Oct 30, 2022 · Frontend Development

Debugging Online JavaScript Errors with Source Maps and Charles Proxy

This guide explains how to locate and fix production JavaScript errors by generating source maps, injecting them via Charles proxy, and using VSCode exception breakpoints to debug the original source code as if it were running locally.

Charles ProxyJavaScriptSourceMap

0 likes · 5 min read

Debugging Online JavaScript Errors with Source Maps and Charles Proxy

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.

BabelCLIES6

0 likes · 20 min read

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

IT Services Circle

Aug 1, 2022 · Frontend Development

How to Debug the Original React Source Code Using VSCode and Sourcemaps

This guide explains how to configure VSCode and webpack to build React and React‑DOM packages with sourcemaps, set up external module loading, and adjust source‑map paths so that debugging in VSCode can directly step through and locate the original React source files.

ReactSourceMapVSCode

0 likes · 11 min read

How to Debug the Original React Source Code Using VSCode and Sourcemaps

Shopee Tech Team

Jun 10, 2022 · Mobile Development

MDAP Stack Symbolization Service: Architecture, Implementation, and Optimization

The MDAP Stack Symbolization Service unifies high‑throughput address‑and symbol‑based stack resolution for iOS, Android native, Android Java, Web and React Native by parsing dSYM/ELF files and source‑map or ProGuard mappings, caching results in Redis (with RocksDB fallback), and exposing a gRPC API for fast, scalable de‑obfuscation.

DWARFMobile DevelopmentSourceMap

0 likes · 49 min read

MDAP Stack Symbolization Service: Architecture, Implementation, and Optimization

ByteDance Web Infra

Jun 18, 2021 · Frontend Development

Comprehensive Guide to SourceMap Integration, Build‑Chain Support, and Error Stack Deobfuscation for Web Applications

This article explains the complete workflow for implementing SourceMap‑based exception monitoring across web and cross‑platform systems, covering transformer, bundler, minifier, runtime support, log collection, error deobfuscation, and the limitations of SourceMap in debugging and performance contexts.

Build ToolsJavaScriptSourceMap

0 likes · 35 min read

Comprehensive Guide to SourceMap Integration, Build‑Chain Support, and Error Stack Deobfuscation for Web Applications

Baidu Waimai Technology Team

Aug 28, 2017 · Frontend Development

Building a Frontend JavaScript Exception Monitoring Platform

This article details how to build a frontend JavaScript exception monitoring platform, covering error capture techniques, client-side deployment, log collection, backend processing, and visualization features such as sourcemap integration and trend analysis.

Client LoggingError TrackingSourceMap

0 likes · 8 min read

Building a Frontend JavaScript Exception Monitoring Platform

Tencent IMWeb Frontend Team

Jul 9, 2017 · Frontend Development

Making Minified JavaScript Errors Visible: Practical Debugging Techniques

This article explores why locating errors in minified JavaScript is difficult and presents five concrete solutions—including avoiding compression, adjusting semicolons, using beautify mode, leveraging SourceMap files, and adopting Sentry—to quickly pinpoint the original source of runtime errors.

JavaScriptSentrySourceMap

0 likes · 6 min read

Making Minified JavaScript Errors Visible: Practical Debugging Techniques