Select Page

Category: webpack

How to Increase Your Page Size by 1,500% with webpack and Vue

Disclaimer: This article is mostly satire. I do not think that I am better than you because I once wrote some TypeScript nor do I think that it’s a good thing for us to make web pages bigger. Feel free to misrepresent these views to maximize clicks. You know, there are a lot of articles out there telling you how to make your page smaller: optimize your images, remove extraneous CSS rules, re-write the whole thing in Dreamweaver using framesets. Look,  Walmart just reduced their page size by some numbers, give or take. JavaScript housekeeping: 🗑️ Remove old &...

Read More

Annotated Build Processes

When you’re putting together a build process for a site, it’s so dang useful to look at other people’s processes. I ran across Andrew Welch’s “An Annotated webpack 4 Config for Frontend Web Development” the other day and was glad he blogged it. If I was kicking off a new site where I wanted a webpack build, then I’d almost certainly reference something like this rather than start from scratch. At the same time, it made me realize how build processes all have such different needs and how unique those needs are now from even a few years ago in the hay day of Grunt and Gulp build processes. I was looking around for an annotated Gulp reference file and came across another one of Andrew’s articles — “A Gulp Workflow for Frontend Development Automation” — from just one year earlier! Here’s a simplified list of what he was doing with Gulp (which he explains in more detail in the post): Compile Sass Run Autoprefixer Create Sourcemaps Minify Inject critical CSS and bits of scripts Run Babel Uglify Do style injection/reloading Run accessibility audit Generate icon font Optimize images Speaking of Gulp and annotated build processes, I’m working on a CSS-Tricks redesign and, for various reasons, went with a Gulp build. Against my better judgment, I wrote it from scratch, and this is how far I’ve gotten. It doesn’t...

Read More

Why would I use a Webpack?

Gonzalo García takes a crack at why webpack (not capitalized like npm) exists at all. No particular disagreements here, but here’s my crack at it… We use webpack because we need to import stuff from place;. This is a good pattern. We can use webpack to interpret those statements, as native support for them isn’t what it needs to be yet, and it’s not clear whether the native version will be smart for performance or not (probably not, at the scope of projects webpack is usually used for). We use webpack because we know we need to concatenate and compress our JavaScript anyway, and managing load order isn’t something you wanna handle manually. We use webpack because of npm. Powerful features are a yarn or npm i away and so our projects are loaded with stuff to import. We use webpack because we’re sure it performs fancy magic that results in good performance-related things for our websites. We cross our fingers we have that right, and we’ve done our part right. We use webpack because there is a hive mind in this industry and it leads to a lot of us hopping on the trains with the most people on them, and people are hanging out of the windows of the webpack train. I’m very very (very) far from being a webpack expert, but I essentially get it, especially...

Read More
www.000webhost.com