30 open-source projects similar to petehunt/webpack-howto, ranked by shared indexed features. Tags may describe platforms or build tools rather than the same primary purpose. Check each project’s use case, license, and deployment requirements before treating it as a replacement.
This repository is a collection of Webpack configuration examples and JavaScript module bundler demonstrations. It provides asset pipeline tutorials and frontend build tool examples focused on resolving dependencies and merging multiple modules into optimized browser files. The project demonstrates how to configure Webpack for transforming JavaScript assets, including the use of loaders and plugins to process JSX, CSS, and images into browser-ready formats. It includes practical examples of code splitting, minification, and environment variable injection. The covered capabilities include fro
Backpack is a Node.js build system designed for transpiling, bundling, and automating the development workflow. It functions as a JavaScript asset bundler that packages source files and dependencies into optimized output for production deployment. The system integrates a transpilation process to convert modern code into versions compatible with various environments and browsers. It provides an automated development workflow that watches for file changes to trigger automatic reloads and builds. The build pipeline supports configuration-driven customization, environment-specific targets, and i
This project is a JavaScript optimizer, minifier, module bundler, transpiler, and static analysis tool. It provides a compilation pipeline designed to shrink file sizes and improve runtime performance. The system utilizes a multi-pass compilation process to perform dead code elimination, global name mangling, and static type inference. It identifies unreachable functions and unused variables to reduce the final output size and detects potential runtime errors without executing the code. The tool manages assets through dependency resolution, code chunking, and bundle management. It ensures co
Browserify is a build utility that enables the use of CommonJS module patterns within client-side JavaScript applications. It functions as a dependency manager and module bundler, tracing recursive import calls to package multiple source files and their dependencies into a single, optimized file for execution in web browser environments. The project distinguishes itself by providing a comprehensive compatibility layer that allows server-side code to run in the browser. It achieves this by injecting environment shims and replacing system-level globals with browser-compatible equivalents. Throu
Webpacker is a frontend build tooling system and JavaScript module manager that integrates Webpack into Ruby on Rails applications. It serves as a bridge between the backend web framework and the frontend build process to compile JavaScript and CSS into browser-ready bundles. The system provides a dedicated development asset server for real-time code reloading and automatic browser refreshing. For production, it includes a precompilation pipeline that minifies scripts and stylesheets and applies network asset compression to optimize delivery. The project covers comprehensive asset management
This project is a unified toolchain for JavaScript and TypeScript development, providing a suite of specialized tools for bundling, parsing, linting, and formatting source code. The toolchain is implemented in Rust and utilizes a shared internal representation to allow multiple tools to operate on the same parsed source code. It employs a parallelized analysis pipeline and single-pass parsing with error recovery to process files across CPU cores. The suite covers several core capability areas, including static analysis for identifying programmatic errors, automated style standardization, and
Poi is an extensible, zero-configuration module bundler and asset compiler for modern frontend development. It functions as a build system that transforms JavaScript, JSX, and CSS into browser-compatible files and combines them into single packages for web delivery. The tool is built around a plugin architecture that allows for custom extensions to the build pipeline and the addition of specialized asset processing logic. It employs a convention-based mapping system to automate build settings and target outputs without the need for manual configuration files. The project covers a broad range
Fuse-Box is a JavaScript bundler, module loader, and development web server. It packages JavaScript source files into optimized bundles for execution in both browser and server environments. The project manages the front-end development workflow by combining asset bundling with a local server to preview application changes in real time. It includes a programmatic API for loading and executing JavaScript modules in the browser. The system handles JavaScript asset bundling and module loading through dependency-graph analysis and dynamic entry-point resolution. It employs an incremental build p
modern.js is a full-stack web framework and frontend component toolchain. It functions as a development platform for building web applications with integrated routing and server-side rendering, while also serving as a static site generator and a Node.js application scaffold. The framework utilizes a Rust-based compiler for high-performance bundling to accelerate the transformation and packaging of assets. It employs a convention-over-configuration approach to reduce manual setup and uses plugin-driven extensibility to modify the build pipeline. The project covers a wide range of capabilities
This project is a high-performance compiler written in Rust that transpiles TypeScript and ECMAScript into compatible JavaScript code. It functions as a TypeScript transpiler, a JavaScript minifier, and a JavaScript bundler. The system distinguishes itself through a WebAssembly plugin host that allows the execution of custom transformation rules without modifying the core binary. It also provides specialized compilation for React source code to improve runtime performance and reduce execution overhead. The broader capability surface includes source-to-source compilation, type annotation stri
RequireJS is a JavaScript module loader and dependency manager that implements the Asynchronous Module Definition API. It enables the asynchronous loading of JavaScript files in the browser to prevent page rendering blocks and manages interdependent scripts to avoid global namespace pollution and execution order issues. The project includes a build optimizer that combines and minifies multiple script files into single bundles to reduce network requests. It also provides a mechanism for version management, allowing multiple versions of the same library to coexist on a single page without confl
This project is a web development boilerplate and starter kit providing a pre-configured foundation for creating high-performance, responsive websites. It functions as a development kit for building progressive web apps, incorporating a front-end build pipeline and responsive site templates. The kit distinguishes itself through a multi-device testing workflow that synchronizes clicks, scrolls, and form inputs across multiple browsers and devices in real-time. It also includes a dedicated setup for offline functionality using service workers and web manifests to enable native-like installation
Rolldown is a high-performance JavaScript and TypeScript module bundler written in Rust. It functions as a fast module compiler that implements a Rollup-compatible API to ensure compatibility with existing workflows and plugins while specializing in ECMAScript Module formats. The project distinguishes itself by using a Rust-based core engine and lazy compilation to reduce the time spent resolving and transforming source code. It focuses on minimizing final delivery sizes through static analysis and tree-shaking to remove unused code. The toolset covers a broad range of build capabilities, in
Blendid is a Gulp-based static site generator and asset pipeline designed to transform source files into finished websites. It functions as a system for rendering HTML documents by injecting structured configuration data into templates and managing the automated build pipelines required for production delivery. The project provides a configurable asset pipeline that bundles and minifies JavaScript with environment-specific options and source maps. It includes a compiler that transforms Sass and PostCSS files into minified, vendor-prefixed CSS stylesheets. The build automation surface covers
Laravel Mix is a frontend asset pipeline and JavaScript build tool that functions as a wrapper for Webpack. It provides a declarative configuration system to simplify the compilation and bundling of JavaScript and CSS assets. The tool focuses on Webpack workflow simplification, allowing users to manage complex build pipelines without writing extensive configuration files from scratch. It uses a fluent interface API to define build steps and asset transformation rules. The system covers modern web asset bundling, including JavaScript module transpilation and CSS preprocessor integration for S
This project is a technical reference and guide for optimizing the performance of Angular applications. It provides a comprehensive checklist for improving speed and efficiency by focusing on bundle optimization, rendering best practices, and runtime execution. The guide covers a wide array of differentiators including the implementation of progressive web app strategies through service workers and offline caching. It also details methods for improving perceived load times using server-side rendering and application shells. The repository provides guidance on broader capability areas such as
react-pxq is a React Redux boilerplate and state-driven UI framework designed for building single-page applications. It functions as a starter project template that combines a client-side routing system with global state management to synchronize data across a component hierarchy. The project implements a code-split web application architecture that uses lazy loading to reduce initial bundle sizes. It integrates a navigation system that maps URL paths to components without triggering full page reloads. The framework covers centralized state management through a global store and action-based
This project is a JavaScript full-stack tutorial providing a step-by-step guide to building a complete web application from scratch. It focuses on the manual implementation of a custom JavaScript toolchain, encompassing the development of a server-side rendering workflow and a client-side state manager. The project distinguishes itself by implementing core development utilities without high-level frameworks, including custom solutions for bundling, transpilation, linting, and hot module replacement. It also features a real-time communication system based on WebSockets for bidirectional messag
This project is an open-source 3D game engine designed for building high-fidelity games, simulations, and cinematic environments. It functions as a robotics simulation platform with native integration for ROS 2 to model robot controllers and sensors. The engine features a multi-threaded Forward+ physically based renderer that supports hardware-accelerated ray tracing and global illumination. The system is built on a modular extension architecture using Gems to add or replace features without modifying core binaries. It includes a native SDK for AWS cloud integration, enabling IAM authenticati
This project is a pre-configured development environment and project boilerplate for building web applications with React, Redux, and React-Router. It provides a standardized project layout and toolchain to accelerate application bootstrapping. The project implements a feature-based architecture template, which uses a modular directory organization to group components, state, and logic by application feature rather than by technical file type. The toolchain includes a frontend configuration for compiling, linting, and bundling JavaScript and Sass assets, alongside a JavaScript unit testing s
Webpack is a module bundler that maps project dependencies into a directed acyclic graph to transform diverse file types into optimized, browser-ready assets. It functions as a build pipeline orchestrator, using entry points to recursively resolve imports and bundle modules, scripts, and static assets into a unified output. The project is distinguished by its plugin-based architecture and loader-driven transformation pipeline. It utilizes an event-driven hook system that allows developers to intercept and modify the build process at specific lifecycle stages, enabling custom code transformati
This project is a front-end development study guide and technical roadmap designed to introduce the tools, libraries, and patterns used in modern web application development. It serves as an educational resource covering single page application architecture, the integration of modern web tech stacks, and the design of components using static typing. The guide focuses on the orchestration of front-end CI/CD pipelines, providing a walkthrough for automating the linting, testing, bundling, and deployment of static assets to cloud hosting. It specifically addresses the implementation of reusable
Microbundle is a zero-configuration JavaScript module bundler designed to package small libraries and modules into optimized distribution files. It serves as a JavaScript library packager and TypeScript compiler, converting source code into compatible module formats for both browser and server-side runtimes. The tool functions as a bundle size optimizer by mangling object properties and analyzing bundle composition to reduce final file sizes. It also acts as a CSS module processor, converting style imports into external stylesheets or scoped modules to prevent global namespace collisions. It
This project is a pre-configured foundation for web applications, providing a structured codebase and build tools for starting new frontend projects. It serves as a boilerplate that integrates React for the user interface, Redux for state management, and React-Router for navigation. The architecture is distinguished by its use of nested route definitions to handle hierarchical navigation and a system for dynamic reducer injection, which allows state management logic to be added to the store at runtime as specific modules load. The toolkit covers a broad range of frontend capabilities, includ
react-static is a React static site generator that transforms components into static HTML files to improve page load speed and search engine optimization. It functions as a progressive web app framework, exporting static HTML that hydrates into a full interactive application to enable real-time updates and instant navigation. The project distinguishes itself as a static site asset optimizer, using code-splitting and an asset prefetching queue to reduce perceived load times. It includes a dedicated MDX content processor to generate routes from Markdown files with JSX and frontmatter, as well a
preact-cli is a command line tool for scaffolding, developing, and building applications using the Preact library. It provides a Webpack-based build pipeline to coordinate code transformation, asset optimization, and production compilation. The toolkit includes a static site prerenderer to convert application routes into static HTML files and a PWA development toolkit for generating service workers and offline asset caching. It also functions as a frontend development server featuring hot module replacement and a proxy for real-time application iteration. The project covers a broad range of
This project is an AST-based code optimizer and compressor for modern ECMAScript, JSX, and TypeScript source code. It functions as a JavaScript minifier that uses the Babel toolchain to reduce file size by removing unnecessary characters and whitespace while preserving program logic. The tool is distinguished by its ability to process experimental language proposals and transform modern syntax into browser-compatible versions. It provides specialized handling for React JSX transpilation and strips type annotations from TypeScript files to produce compressed production assets. The system cove
This project is a comprehensive manual and educational resource focused on the Babel compiler. It serves as a documentation guide and handbook for understanding the inner workings of JavaScript compilation, specifically regarding the transformation of source code. The material provides a technical walkthrough for developing custom plugins and extensions. It covers the process of creating tailored transformations to modify how JavaScript is parsed and generated. The content encompasses the broader JavaScript compilation workflow, focusing on abstract syntax tree manipulation, code generation,
esbuild is a high-performance JavaScript bundler and transpiler designed to transform modern web assets into production-ready code. Built with a focus on speed, it utilizes a concurrent execution model to perform parsing, linking, and code generation across multiple CPU cores. The engine handles a wide range of tasks, including TypeScript compilation, JSX transformation, and CSS bundling, while maintaining a consistent build process across diverse environments. What distinguishes the project is its architecture, which leverages memory-mapped file processing and a single-pass transformation st
nwb is a zero-configuration build toolchain, module bundler, and development server for JavaScript and JSX applications and libraries. It functions as a build system that automatically derives compiler and bundler settings from a project's installed dependencies to remove manual setup. The tool is distinguished by its ability to act as a library compiler, generating multiple distribution formats such as ESM and CJS from a single source for package manager compatibility. It also includes a dedicated headless browser test runner that executes unit tests with integrated watch mode and code cover