banner
DIYgod

Hi, DIYgod

写代码是热爱,写到世界充满爱!
github
twitter
bilibili
telegram
email
steam
playstation
nintendo switch

Service Workers enable website acceleration and offline caching.

Recently, I came across this thing called Service Workers. It allows users to cache website static and dynamic resources based on configuration. It intercepts all network requests from users and decides whether to retrieve the corresponding resources from cache or the network, thereby greatly improving the loading speed of web pages. Its advantages include high customizability, no need for server-side support, and significant effects.

The end result is that when you visit my website for the second time, only about 80k of resources will be loaded (excluding AdSense), including all images and audio/video files. This 80k mainly consists of HTML and the API of DPlayer that I use.

sw4

It can even be accessed when the network is disconnected (try disconnecting the network cable):

sw2

Of course, there are limitations:

It only supports HTTPS because it intercepts users' network requests and requires a secure environment.

Compatibility is not very good. Click here to view the compatibility report. Currently, only Chrome, Firefox, Opera, and some Android browsers support it.

sw3

There are many tutorials available online on how to use it, so I won't go into detail here. I recommend these articles:

Using service worker and sw-precache to accelerate websites

Using Service worker to accelerate/offline access to static blog websites

Service Workers and offline caching

Loading...
Ownership of this post data is guaranteed by blockchain and smart contracts to the creator alone.