All Categories


Smashing Service Worker

There’s no shortage of boosterism or excitement about the fledgling service worker API, now shipping in some popular browsers. There are cookbooks and blog posts, code snippets and tools. But I find that when I want to learn a new web concept thoroughly, rolling up my proverbial sleeves, diving in and building something from scratch is often ideal. The bumps and bruises, gotchas and bugs I ran into this time have benefits: Now I understand service workers a lot better, and with any luck I can help you avoid some of the headaches I encountered when working with the new API.

Further Reading on SmashingMag: A Beginner’s Guide To Progressive Web Apps Building A Simple Cross-Browser Offline To-Do List World Wide Web, Not Wealthy Western Web Service workers do a lot of different things; there are myriad ways to harness their powers. I decided to build a simple service worker for my (static, uncomplicated) website that roughly mirrors the features that the obsolete Application Cache API used to provide — that is: "You must unlearn what you have learned!" Meet the brand new episode of SmashingConf San Francisco with smart front-end tricks and UX techniques.

Featuring Yiying Lu, Aarron Draplin, Smashing Yoda, and many others. Tickets now on sale. April 17-18. Check the speakers ? make the website function offline, increase online performance by reducing network requests for certain assets, provide a customized offline fallback experience. Before beginning, I’d like to acknowledge two people whose work made this possible. First, I’m hugely indebted to Jeremy Keith for the implementation of service workers on his own website, which served as the starting point for my own code.

I was inspired by his recent post describing his ongoing service worker experiences. In fact, my work is so heavily derivative that I wouldn’t have written about it except for Jeremy’s exhortation in an earlier post: So if you decide to play around with Service Workers, please, please share your experience. Secondly, all sorts of big old thanks to Jake Archibald for his excellent technical review and feedback. Always nice when one of the service worker specification’s creators and evangelists is able to set you straight!

What Is A Service Worker? A service worker is a script that stands between your website and the network, giving you, among other things, the ability to intercept network requests and respond to them in different ways. In order for your website or app to work, the browser fetches its assets — such as HTML pages, JavaScript, images, fonts. In the past, the management of this was chiefly the browser’s prerogative.

If the browser couldn’t access the network, you would probably see its "Hey, you’re offline" message. There were techniques you could use to encourage the local caching of assets, but the browser often had the last say. This wasn’t such a great experience for users who were offline, and it left web developers with little control over browser caching. Cue Application Cache (or AppCache), whose arrival several years ago seemed promising.

About the Author

The name of the author is Levi Hansen. My job can be a software developer but soon my wife and I am going to start our business.
My husband doesn't like it the way I do but things i really like doing is fixing computers nonetheless haven't made dime by it.
Nebraska may be the place I enjoy most having said that I'm considering other brands. My husband . i maintain a webpage. You may wish for to do it here: is a service worker-is-a-service-worker/


No comments yet! Be the first:

Your Response

Most Viewed - All Categories

powered by Delhi Site