Blog
Mert Özen's blog posts on software development, backend, frontend, and DevOps.
Why Build Tools Exist: Module Graphs, Transpiling, Bundling, Minification and the Dev Server's Job
A build tool does what the browser cannot do on its own: it resolves imports into a module graph, transpiles TypeScript, drops unused code, bundles and minifies files and gives them content-hashed names. Using Bookstore's book search widget, we look at the 642 requests of bundler-free ESM, the 3-request output from Vite 8, Baseline build targets and the difference between the dev server and a production build, all with real output.
Code Splitting, Tree Shaking and Bundle Analysis: Finding What Bloats Your Bundle
Do not guess what bloats a bundle, measure it: ng build --stats-json, source-map-explorer, rollup-plugin-visualizer and webpack-bundle-analyzer show the breakdown by package, and tree shaking only works on ESM modules without side effects. In Bookstore's Angular app we see that named imports from lodash gain nothing, that a barrel file carries side effects, that removing moment and lodash takes main from 359 kB to 224 kB, and how to make the vendor chunk decision in Vite.