DEV Community ๐Ÿ‘ฉโ€๐Ÿ’ป๐Ÿ‘จโ€๐Ÿ’ป

Cover image for You've Gotta Check Out SnowPack...
Nukala Suraj
Nukala Suraj

Posted on

You've Gotta Check Out SnowPack...

Introduction

So like most 2020 developers I used to give 0 fucks about bundlers...

I mean react/next/svelte takes care of it for us right

but then, I started doing this course called threejs journey by brunosimon in which bruno makes us understand why bundlers are important

node_modules meme
TL;DR helps client import node_modules files that are stored on the server

WebPack

The world's most popular javascript bundler "webpack" has a bunch of disadvantages

  1. It is pretty complex, for context and it took me 2 days to understand and be able to configure webpack on my own
  2. It is kinda really slow cuz it rebuilds and rebundles the files for every change [especially if you want to use typescript]

Here's Recordings of WebPack

Time to Initial Load: 35s

Time to Load Changes: 20s

Enter Snowpack

Snowpackjs has a fundamentally different approach to bundling...
It builds each file and caches it for future use, while webpack rebuilds and rebundles every single time
Help

Bonus

Snowpack is super easy to configure
here's the config I used in the below test

module.exports = {
  mount: {
    src: { url: "/" },
    public: { url: "/", static: true },
  },
};
Enter fullscreen mode Exit fullscreen mode

it mounts files in src, public dir to "/" (root directory of served content)

Here's Recordings of Snowpack

Time to Initial Load: 20s

Time to Load Changes: 14ms ๐Ÿ˜ฑ
screenshot

Thanks

if you โค๏ธ this blog post... I'd โค๏ธ to tell you that this is the blogified version of the following thread

Top comments (7)

Collapse
 
leob profile image
leob

Most amazingly - Snowpack is programmed in Typescript! Not in Go, not in Rust, not in C++ ... just TS ! So probably it's fast because of it's approach/design, more than because of its implementation per se.

But what happened to all of the other blazing-fast bundlers which were making waves recently (and which were indeed programmed in Go, Rust, C++ and so on)? Would be interesting to compare (hint: follow-up article?)

Collapse
 
lucidmach profile image
Nukala Suraj

yupp it's approach/design is just amazing and sure that's what makes it so fast and wonderfull

Collapse
 
turry profile image
Turry

Interesting

Collapse
 
lucidmach profile image
Nukala Suraj

Ikr

Collapse
 
lyrod profile image
Lyrod

ViteJs, esbuild. Oh yeah

Collapse
 
adam_cyclones profile image
Adam Crockett

He's right you know

Collapse
 
lucidmach profile image
Nukala Suraj

๐Ÿ˜…๐Ÿ˜

We are hiring! Do you want to be our Senior Platform Engineer? Forem is hiring a Senior Platform Engineer

If you're interested in ops and site reliability and capable of dipping in to our Linux stack, we'd love your help shoring up our systems!