Friday, July 27, 2018

Page Lifecycle API

Philip Walton (via Hacker News):

Modern browsers today will sometimes suspend pages or discard them entirely when system resources are constrained. In the future, browsers want to do this proactively, so they consume less power and memory. The Page Lifecycle API, shipping in Chrome 68, provides lifecycle hooks so your pages can safely handle these browser interventions without affecting the user experience.

Philip Walton:

As I was doing my research for the article, I found a lot of things that really surprised me. And I feel pretty confident in saying that most web developers aren’t aware of these things either.

Here are my top four:

- We shouldn’t use the unload event. Ever.

- The unload event often doesn’t fire when closing tabs/app on mobile

- The pagehide/pageshow events even exist (virtually no one I’ve talked to knows what they do; most people think they’re about page visibility).

- In browsers that implement a page navigation cache, you can click a link to navigate away and then navigate back with the back button, and all your JS code is exactly as it was before you navigated.

2 Comments RSS · Twitter


The thing I want as a user is the ability to *Pause* a page. Especially if I notice it is using a lot of CPU, but don't necessarily want to close it, I want the ability to tell Safari to just stop it running any further code and let me unpause it later.

Plus it still staggers me how much a web page can do when it is not the current front web page. Like track the mouse for example - why on earth does Safari allow a non-front web page to track the mouse position change?


Peter, is this what "Pause Web Process" does in the Safari Debug menu? I'm using the tech preview right now, but I recall it being in the release version's Debug menu as well.

I agree about the mouse tracking — it creeps me out when I see web pages in background windows reacting to mouse movements.

Leave a Comment