Rollup VS webpack

Compare Rollup vs webpack and see what are their differences.

Rollup

Next-generation ES module bundler (by rollup)

webpack

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff. (by webpack)
Our great sponsors
  • Appwrite - The Open Source Firebase alternative introduces iOS support
  • InfluxDB - Access the most powerful time series database as a service
  • Sonar - Write Clean JavaScript Code. Always.
Rollup webpack
56 282
23,185 62,818
1.3% 0.6%
9.7 9.2
8 days ago 5 days ago
JavaScript JavaScript
GNU General Public License v3.0 or later MIT License
The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.

Rollup

Posts with mentions or reviews of Rollup. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2023-03-26.
  • JavaScript Module Bundlers and all that Jazz ✨
    6 projects | dev.to | 26 Mar 2023
    Other popular build tools include Vite.js, Browserify, Rollup - The bundler behind vite.
  • React Server Components and Client Components with Rollup
    3 projects | dev.to | 18 Mar 2023
    Awhile back I wrote about packaging your JavaScript library code into a dual-module bundle (ESM + CommonJS) using Rollup module bundler. Make sure to check it out (it's been updated for Rollup v3!).
    3 projects | dev.to | 18 Mar 2023
    While searching for a solution, I came across this issue. Ironically, one of the suggested solutions in there was the initial solution described earlier above. However, there was also another suggestion.
  • The Complete Guide to User Authentication in Firebase
    2 projects | dev.to | 10 Feb 2023
    In this blog, we'll cover how to implement a simple login signup functionality using firebase. We'll be using modular JavaScript SDK, which (according to the documentation) provides a reduced SDK size and greater efficiency with modern JavaScript build tools such as Webpack or Rollup.
  • What is your ideal setup for new project for solo developers
    6 projects | reddit.com/r/node | 3 Feb 2023
    My go-to front end these days is Lit with web components, rollup, and web dev server.
  • How to use Firestore with Redux in a React application
    7 projects | dev.to | 25 Jan 2023
    With tools like webpack (used by create-react-app under the hood), your entire application needs to be bundled in a single file before it can be served to the browser. Vite, on the other hand, takes advantage of native ES modules in the browser to make bundling more efficient with Rollup, serving parts of the source code as needed.
  • Enhance your Docsify experience with your own plugin
    4 projects | dev.to | 9 Jan 2023
    We use Vite as a dev server. This allows you to take advantage of hot reloading in development and easily build and minify code with Rollup integration. Vitest is also provided, so you can write tests in the matching folder.
  • Introduction to React Suspense
    5 projects | dev.to | 27 Dec 2022
    In this project I use my favorite bundling tool called vite, It is a fast compiler & bundler, and it uses rollup under the hood.
  • Fixing Class Composition in Tailwind CSS
    10 projects | dev.to | 14 Dec 2022
    While not too long, css`@apply is a lot to repeat for every class you want to “compile”. That’s why using Vite and some Rollup plugins (Vite uses Rollup under the hood) I was able to shorten it into this:
  • Getting Tailwind to Work with Elm Book
    12 projects | dev.to | 28 Nov 2022
    Most front-end frameworks nowadays include these features as part of their CLI’s such as Create React App, Angular’s ng-cli, etc. For those that don’t, many will use a combination of some type of bundler like Parcel, Rollup, or Webpack and a browser refresher like livereload. This enables you to write code, save it, and immediately see the results. This in turn leads to fast feedback as you iterate all day in this build loop. The native Elm Reactor doesn’t offer this ability and elm-live fits the bill as a small Node.js library to enable this.

webpack

Posts with mentions or reviews of webpack. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2023-03-26.
  • JavaScript Module Bundlers and all that Jazz ✨
    6 projects | dev.to | 26 Mar 2023
    Webpack is a static module bundler for modern JavaScript applications. On processing your application - Webpack internally builds a dependency graph from one or more entry points and then combines every module your project needs into one or more bundles, which are static assets from which content is served.
  • Benchmarking the AWS SDK
    2 projects | dev.to | 20 Mar 2023
    The other option I want to highlight is packaging the project using something like Webpack or esbuild. JS Bundlers transpile all of your separate files and classes (along with all node_modules) into one single file, a practice originally developed to reduce package size for frontend applications. This helps improve the cold start time in Lambda, as unimported files can be pruned and the entire handler becomes one file.
  • What’s New With Nuxt 3
    6 projects | dev.to | 5 Mar 2023
    It supports webpack 5 and Vite, which supports hot module replacement during development and assembles your code for production,
  • Criando um Parser de JSON do zero
    7 projects | dev.to | 24 Feb 2023
  • Tutorial - Build a chatbot with React and OpenAI
    4 projects | dev.to | 21 Feb 2023
    I have plans on writing an email that does a bit more of a deep-dive into Vite but in summary, Vite is a build tool and development server that is designed to optimize the development experience of modern web applications. Think Webpack but with faster build/start times and a few additional improvements.
  • 7 Tools and Frameworks for Faster Development in React
    6 projects | dev.to | 20 Feb 2023
    The next on this list is not a framework but a JavaScript open-source module bundler.Webpack is often used in React applications to bundle the application code and related assets into a single file that can be served to the browser.
  • Rethinking the Modern Web
    2 projects | dev.to | 12 Feb 2023
    We must now rigor through the surprisingly high amount of code-level complexity, and pay the price of a compile-step (with Webpack and babel (or similar beast) and a barrage of configurations, plugins and extensions) to have a working web page! But that's not all, we must also bend along with mind-bending runtime behaviours (of hooks and friends), and debug through difficult-to-grok transforms of our code!
  • Decoding JS: Polyfills and Transpilers
    2 projects | dev.to | 11 Feb 2023
    Build systems or bundlers such as webpack, provide a means to run a transpiler automatically on every code change. So, they could be integrated into development processes.
  • The Complete Guide to User Authentication in Firebase
    2 projects | dev.to | 10 Feb 2023
    In this blog, we'll cover how to implement a simple login signup functionality using firebase. We'll be using modular JavaScript SDK, which (according to the documentation) provides a reduced SDK size and greater efficiency with modern JavaScript build tools such as Webpack or Rollup.
  • React setup without create-react-app
    3 projects | dev.to | 5 Feb 2023
    if you want to learn more about webpack just go to this website https://webpack.js.org/ explore it and see more settings in webpack.

What are some alternatives?

When comparing Rollup and webpack you can also consider the following projects:

craco - Create React App Configuration Override, an easy and comprehensible configuration layer for Create React App.

esbuild - An extremely fast bundler for the web

vite - Next generation frontend tooling. It's fast!

tsup - The simplest and fastest way to bundle your TypeScript libraries.

parcel - The zero configuration build tool for the web. 📦🚀

gulp - A toolkit to automate & enhance your workflow

Snowpack - ESM-powered frontend build tool. Instant, lightweight, unbundled development. ✌️ [Moved to: https://github.com/FredKSchott/snowpack]

react-app-rewired - Override create-react-app webpack configs without ejecting