DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 963,673 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for Angular Performance: Precaching with the Service Worker
Juri Strumpflohner for Angular

Posted on • Originally published at juristr.com

Angular Performance: Precaching with the Service Worker

This post has originally been published on https://juristr.com/blog/2019/08/ngperf-precaching-serviceworker. Go to juristr.com/blog for more content


This article is part of my "Angular Performance Week" series, where I publish a new video each day based on the performance articles on web.dev/angular. Today we're diving into the service worker API, in specific by leveraging Angular's integrated service worker package.

Note: this article and attached Egghead video lesson are based on the articles on web.dev/angular by Minko Gechev and Stephen Fluin. Full credit goes to them πŸ‘

Angular Performance Series

  1. Route Level Code Splitting
  2. Preload Lazy Routes in Angular
  3. Performance budgets with the Angular CLI
  4. Optimize Angular's Change Detection
  5. Virtual Scrolling for large lists with the CDK
  6. Precaching with the Angular Service Worker

Don't miss the other videos by subscribing to my newsletter.

Caching with Angular's Service Worker Package

To further speed up our app and to provide a more pleasant experience in flaky network conditions, we may want to use a service worker that allows us to apply precaching mechanisms. Luckily the Angular team already offers a service worker module that is well integrated with the framework. Let’s have a look at how to apply that to our application.

Original web.dev article

Wanna read the original web.dev article? Check it out here!.

Top comments (1)

Collapse
 
_rahulpandit profile image
Rahul Pandit

Nice article about performance

Take a look at this:

Settings

Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. πŸ›