[{"slug":"easiest-and-reliable-way-to-identify-the-last-activity-on-a-page","frontmatter":{"content":"\n![Easiest%20and%20Reliable%20way%20to%20identify%20the%20last%20acti%20761668d0e209475595a4da1bbfea1178/pexels-markus-spiske-1089440.webp](/notion/Easiest%20and%20Reliable%20way%20to%20identify%20the%20last%20acti%20761668d0e209475595a4da1bbfea1178/pexels-markus-spiske-1089440.webp)\n\n`visibilitychange` EVENT is the easiest and reliable way to identify if you are going to see your website visitor for the last time for that page. [This](https://www.igvita.com/2015/11/20/dont-lose-user-and-app-state-use-page-visibility/) is an excellent article from [Ilya Grigorik](https://www.igvita.com/) that talks about it.\n\n> [Once the application has transitioned to background state, it may be killed without any further ceremony - e.g. the OS may terminate the process to reclaim resources, the user can swipe away the app in the task manager. As a result, you should assume that \"clean shutdowns\" that fire the pagehide, beforeunload, and unload events are the exception, not the rule.](https://www.igvita.com/2015/11/20/dont-lose-user-and-app-state-use-page-visibility/#:~:text=an%20incoming%20call-,Once%20the%20application%20has%20transitioned%20to,To,-provide%20a%20reliable)\n> \n\n```jsx\n// The event fires when\n// 1. A user switches tab\n// 2. Minimizes the browser window\n// 3. Closes the tab\n// 4. ......\ndocument.addEventListener('visibilitychange', () => {\n\tif (document.visibilityState === 'hidden') {\n\t navigator.sendBeacon('/this-is-probably-the-last-you-will-see-me')\n }\n})\n```","data":{"category":"dom-events","creationTs":1622453220000,"date":"May 31, 2021 11:27 AM","lastModified":"November 25, 2021 10:59 AM","lastModifiedTs":1637834340000,"published":"Yes","socialImage":"http://hariombalhara.in/notion/da65995fe01e652229e9700a9ebac23d9539ddd8.webp","title":"Easiest and Reliable way to identify the last activity on a page"},"isEmpty":false,"excerpt":"","category":["dom-events"],"creationTs":1622453220000,"date":"May 31, 2021","lastModified":"November 25, 2021 10:59 AM","lastModifiedTs":1637834340000,"published":"Yes","socialImage":"http://hariombalhara.in/notion/da65995fe01e652229e9700a9ebac23d9539ddd8.webp","title":"Easiest and Reliable way to identify the last activity on a page","updated":"November 25, 2021"},"content":"

$\"Easiest%20and%20Reliable%20way%20to%20identify%20the%20last%20acti%20761668d0e209475595a4da1bbfea1178/pexels-markus-spiske-1089440.webp\"$

visibilitychange EVENT is the easiest and reliable way to identify if you are going to see your website visitor for the last time for that page. This is an excellent article from Ilya Grigorik that talks about it.

\n
Once the application has transitioned to background state, it may be killed without any further ceremony - e.g. the OS may terminate the process to reclaim resources, the user can swipe away the app in the task manager. As a result, you should assume that "clean shutdowns" that fire the pagehide, beforeunload, and unload events are the exception, not the rule.
\n

// The event fires when\n// 1. A user switches tab\n// 2. Minimizes the browser window\n// 3. Closes the tab\n// 4. ......\ndocument.addEventListener('visibilitychange', () => {\n    if (document.visibilityState === 'hidden') {\n      navigator.sendBeacon('/this-is-probably-the-last-you-will-see-me')\n  }\n})\n

\n"}]

Category: dom-events