Build tool plugins for web performance

Last week, Keith Cirkel tweeted out…
Writing a Webpack plugin that makes build times at least as long as it takes to download them.
class WebpackPluginUXGtDX { apply(compiler) { compiler.hooks.emit.tapPromise( ‘UX is more important than DX’, (compilation) => { return new Promise(resolve => { const ms = getP95ForBundleOn3g(); console.log(`This bundle takes ${ms}ms to download`); console.log(`I’m making you wait at least as long as that.`); console.log(`If you want a faster build, work on that.


This content originally appeared on Go Make Things and was authored by Go Make Things

Last week, Keith Cirkel tweeted out…

Writing a Webpack plugin that makes build times at least as long as it takes to download them.

class WebpackPluginUXGtDX {
  apply(compiler) {
    compiler.hooks.emit.tapPromise(
      'UX is more important than DX',
      (compilation) => {
        return new Promise(resolve => {
          const ms = getP95ForBundleOn3g();
          console.log(`This bundle takes ${ms}ms to download`);
          console.log(`I'm making you wait at least as long as that.`);
          console.log(`If you want a faster build, work on that.`);
          setTimeout(resolve, ms);
        });
    });
  }
}

The included code, in theory, gets the download time for the bottom 5th percentile of users on 3g connections, and forces the build to wait that long before proceeding.

While this is a joke (I think?), I also think Keith is on to something.

A lot of “thought leaders” in our space obsess over the developer experience (DX), and have bought into the myth that better DX leads to a better user experience (UX). They also often work on really expensive high-end machines, connected to a fast and reliable network.

That’s just not the reality for a lot of people who use what we build. It’s hard for a lot of people to feel empathy without experiencing that pain themselves.

I’d love to see build systems have a built in setting that you can use to throttle builds to what actual users experience.

You can automate some aspects of performance. Minifying and gzipping help. Service workers do, too.

But a lot of web performance is baked into the core of your code, how you write it, and what you ship.

I have a favor to ask. If you enjoyed this article, could you share a link to my newsletter on your favorite social media site?


This content originally appeared on Go Make Things and was authored by Go Make Things


Print Share Comment Cite Upload Translate Updates
APA

Go Make Things | Sciencx (2022-11-02T14:30:00+00:00) Build tool plugins for web performance. Retrieved from https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/

MLA
" » Build tool plugins for web performance." Go Make Things | Sciencx - Wednesday November 2, 2022, https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/
HARVARD
Go Make Things | Sciencx Wednesday November 2, 2022 » Build tool plugins for web performance., viewed ,<https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/>
VANCOUVER
Go Make Things | Sciencx - » Build tool plugins for web performance. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/
CHICAGO
" » Build tool plugins for web performance." Go Make Things | Sciencx - Accessed . https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/
IEEE
" » Build tool plugins for web performance." Go Make Things | Sciencx [Online]. Available: https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/. [Accessed: ]
rf:citation
» Build tool plugins for web performance | Go Make Things | Sciencx | https://www.scien.cx/2022/11/02/build-tool-plugins-for-web-performance/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.