Skip to main content

8 posts tagged with "JavaScript"

View All Tags

July 27, 2022 · Updated on · 6 min read
Matt Zeunert

I've always been annoyed by the slow speed of the Google Cloud Console web app. In 2020 I wrote about how a single page loads 16 MB of JavaScript. That same page now loads 21 MB.

But are other cloud providers better? I looked at real-user data from the Chrome User Experience Report and also ran my own tests.

This article looks at Google Cloud Platform (GCP), Amazon Web Services (AWS), and Microsoft Azure.

December 9, 2020 · Updated on · 7 min read
Matt Zeunert

Opening a page in the Google Cloud Console always takes a long time.

Here are some metrics I collected on a high-end 2018 MacBook Pro on a UK-based Gigabit internet connection.

September 8, 2020 · Updated on · 16 min read

Nearly every website uses JavaScript, so JavaScript performance is a growing topic in modern front-end development. In this post we'll introduce common performance pitfalls and discuss how to detect and avoid them.

We'll focus on JavaScript execution and other CPU processing that results from it. Check out our guide to Performant front-end architecture to learn more about structuring your app and prioritizing different types of resources.

JavaScript performance is important for the Interaction to Next Paint.

February 10, 2020 · Updated on · 13 min read
Matt Zeunert

This post describes some techniques to make front-end apps load faster and provide a good user experience.

We'll look at the overall architecture of the front-end. How can you load essential resources first, and maximize the probability that the resources are already in the cache?

September 2, 2019 · Updated on · 4 min read

Splitting your Angular app into several smaller bundles can make your site faster by reducing download and execution times. Instead of loading all code upfront it's fetched lazily when needed.

Most guides to lazy loading Angular modules use Angular's RouterModule and the loadChildren property to load code when the user first navigates to a certain page. But that means you can't lazy load code if whether the code is needed doesn't depend on a route change.

This article will explain how to lazy load Angular feature modules independently of the router.

January 15, 2019 · Updated on · 4 min read

Bundle splitting allows you to delay loading resources until they are actually needed. And Webpack and React make it surprisingly easy!

In this article we'll take a React component that's not needed on every page and move it from the main bundle into a separate bundle that can be lazy loaded.

October 22, 2018 · Updated on · 6 min read
Matt Zeunert

It's easy to keep adding new packages and lose track of the size of your Webpack, Parcel, or Rollup bundle. But large JavaScript files slow down your page not just because they take longer to download, but also because more time is spent parsing, compiling, and executing JavaScript code.

This article outlines some tips and strategies to avoid these performance problems by reducing the size of your JavaScript bundles. Reducing your bundle size can help your website load faster and improve Core Web Vitals metrics like Interaction to Next Paint.