8 ms·

Quirks of the Page Visibility API

53 points by devadvance 4y ago

deleted 4y ago
[deleted]
uallo 4y ago
Off topic: This page is yet another example of many, many websites that display a useless horizontal scrollbar. Non-overlay scrollbars simply do not work with elements that are set to a width of 100vw. Using 100vw is almost always a mistake. https://duckduckgo.com/?q=avoid+100vw https://duckduckgo.com/?q=avoid+100vw
- devadvance 4y ago
  Hi there, thanks for the feedback! I overlooked testing with scrollbars set to always show, as Firefox recently started following macOS/Windows system settings rather than using its own setting. I've updated the CSS to use `100%` to rectify this. For this specific post, a bare link was also causing additional horizontal scroll, so I addressed both in https://github.com/devadvance/devadvance.github.io/commit/6a3e03b84b2f0be397ba2bf1dc98373efb2965d6 https://github.com/devadvance/devadvance.github.io/commit/6a....
- stumblindrunk 4y ago
  “No one” uses non-overlay scrollbars though.
vezycash 4y ago
Feels like this API is designed for web ads
- taf2 4y ago
  Or applications embedded in salesforce that need to know which tab the sales agent is currently in since they have opened 50…
deleted 4y ago
[deleted]
spiffytech 4y ago
I tried using the page visibility API to refresh displayed data when the user returned to the page after being away for a while. It's more efficient than needlessly polling when no one's around to see. I discovered a bunch of these edge cases and had to abandon the approach - it just wasn't reliable. The page would fail to recognize departure + return in too many scenarios and so wouldn't refresh.
dmitriid 4y ago
IIRC this comes down to disagreements between browser vendors as to what is and what isn't potentially harmful (for a wide definition of harmful) detection of user behavior. I don't remember the details, but expect browsers to differ on details of this API basically forever.
- chii 4y ago
  Why isn't the user in charge of whether they want the page visibility api to report them?
  - KyeRussell 4y ago
    An inscrutable power-user feature to appease some privacy purist nerds, all while the 99.999% leaves it set to the default behaviour and gets screwed by ad companies. That’s not fighting for privacy, it’s copping out.
  - dmitriid 4y ago
    How do you imagine the UI for managing that? Don't forget that there are a dozen other APIs with permissions as well.
    - chii 4y ago
      I would imagine the UI to be similar to permission for microphone or camera. There's a default, and a per-site that a user can just override to disable visibility api checks (aka, a page would always think it is visible if set by the user).
      - dmitriid 4y ago
        But then there are multiple details in what activity the visibility API may expose. From the article: - Browser window minimized - browser window covered by another window that is larger - tab hidden in an active browser window - docking/undocking a tab to a browser window - switched to a different desktop - Browser window covered by another browser window that is the same size or smaller - show desktop via F11 or swipe on touchpad - opening Launchpad - opening Mission Control - dragging the window in Mission Control - browser dialogs (print, save, etc.) - during animation to/from full screen - ... The blanket "yes/no" setting isn't nearly enough for these kinds of things. And, again, there are dozens of APIs that require user permission in one way or another.
tppiotrowski 4y ago
It might make sense to detect page visibility prior to loading a pay-per-load API like Mapbox GL JS, Apple Maps on Web, etc. The scenario I imagine is: 1. Your map is loaded 2. User opens a new tab (your map is now in a background tab) 3. User restarts browser and existing tabs are loaded 4. You get charged for an API load even though the page is not visible Does anyone know if this is the case? Edit: also analytics. If you don't load your GA until page is visible, I wonder what impact that has on your visitor numbers
- lloydatkinson 4y ago
  Seems like a good use case. I wrote a Christmas quiz app in December and I could see from the server logs someone must have left the scoreboard page open for weeks as I used polling to check for the latest score. Checking if the tab was even active would have been a good idea.
jeroenhd 4y ago
There are still very few addons you can install on Firefox for Android (without a dev version and a bunch of hassle), but it's telling that one of the few addons that anyone can install disables this API: https://addons.mozilla.org/android/addon/video-background-play-fix/ https://addons.mozilla.org/android/addon/video-background-pl...
- uallo 4y ago
  I recently learned that uBlock Origin can block that API, too. https://news.ycombinator.com/item?id=33997228 https://news.ycombinator.com/item?id=33997228

53 points by devadvance 4y ago

deleted 4y ago

[deleted]

Off topic: This page is yet another example of many, many websites that display a useless horizontal scrollbar. Non-overlay scrollbars simply do not work with elements that are set to a width of 100vw. Using 100vw is almost always a mistake. https://duckduckgo.com/?q=avoid+100vw https://duckduckgo.com/?q=avoid+100vw

devadvance 4y ago
Hi there, thanks for the feedback! I overlooked testing with scrollbars set to always show, as Firefox recently started following macOS/Windows system settings rather than using its own setting. I've updated the CSS to use `100%` to rectify this. For this specific post, a bare link was also causing additional horizontal scroll, so I addressed both in https://github.com/devadvance/devadvance.github.io/commit/6a3e03b84b2f0be397ba2bf1dc98373efb2965d6 https://github.com/devadvance/devadvance.github.io/commit/6a....
stumblindrunk 4y ago
“No one” uses non-overlay scrollbars though.

vezycash 4y ago

Feels like this API is designed for web ads

taf2 4y ago
Or applications embedded in salesforce that need to know which tab the sales agent is currently in since they have opened 50…

deleted 4y ago

[deleted]

spiffytech 4y ago

I tried using the page visibility API to refresh displayed data when the user returned to the page after being away for a while. It's more efficient than needlessly polling when no one's around to see. I discovered a bunch of these edge cases and had to abandon the approach - it just wasn't reliable. The page would fail to recognize departure + return in too many scenarios and so wouldn't refresh.

dmitriid 4y ago

IIRC this comes down to disagreements between browser vendors as to what is and what isn't potentially harmful (for a wide definition of harmful) detection of user behavior. I don't remember the details, but expect browsers to differ on details of this API basically forever.

chii 4y ago
Why isn't the user in charge of whether they want the page visibility api to report them?
- KyeRussell 4y ago
  An inscrutable power-user feature to appease some privacy purist nerds, all while the 99.999% leaves it set to the default behaviour and gets screwed by ad companies. That’s not fighting for privacy, it’s copping out.
- dmitriid 4y ago
  How do you imagine the UI for managing that? Don't forget that there are a dozen other APIs with permissions as well.
  - chii 4y ago
    I would imagine the UI to be similar to permission for microphone or camera. There's a default, and a per-site that a user can just override to disable visibility api checks (aka, a page would always think it is visible if set by the user).
    - dmitriid 4y ago
      But then there are multiple details in what activity the visibility API may expose. From the article: - Browser window minimized - browser window covered by another window that is larger - tab hidden in an active browser window - docking/undocking a tab to a browser window - switched to a different desktop - Browser window covered by another browser window that is the same size or smaller - show desktop via F11 or swipe on touchpad - opening Launchpad - opening Mission Control - dragging the window in Mission Control - browser dialogs (print, save, etc.) - during animation to/from full screen - ... The blanket "yes/no" setting isn't nearly enough for these kinds of things. And, again, there are dozens of APIs that require user permission in one way or another.

tppiotrowski 4y ago

It might make sense to detect page visibility prior to loading a pay-per-load API like Mapbox GL JS, Apple Maps on Web, etc. The scenario I imagine is: 1. Your map is loaded 2. User opens a new tab (your map is now in a background tab) 3. User restarts browser and existing tabs are loaded 4. You get charged for an API load even though the page is not visible Does anyone know if this is the case? Edit: also analytics. If you don't load your GA until page is visible, I wonder what impact that has on your visitor numbers

lloydatkinson 4y ago
Seems like a good use case. I wrote a Christmas quiz app in December and I could see from the server logs someone must have left the scoreboard page open for weeks as I used polling to check for the latest score. Checking if the tab was even active would have been a good idea.

jeroenhd 4y ago

There are still very few addons you can install on Firefox for Android (without a dev version and a bunch of hassle), but it's telling that one of the few addons that anyone can install disables this API: https://addons.mozilla.org/android/addon/video-background-play-fix/ https://addons.mozilla.org/android/addon/video-background-pl...

uallo 4y ago
I recently learned that uBlock Origin can block that API, too. https://news.ycombinator.com/item?id=33997228 https://news.ycombinator.com/item?id=33997228