Contents:
Client Tricks #
Detect the Brave Browser #
(navigator.brave && await navigator.brave.isBrave() || false)
Credit: https://stackoverflow.com/a/60954062
Detect Dark Mode #
From JavaScript:
"matchMedia" in window &&
window.matchMedia('(prefers-color-scheme: dark)').matches
From CSS:
@media (prefers-color-scheme: dark) {
/* ... */
}
Detect Dark Reader (browser extension) #
For detecting the Dark Reader browser extension:
"querySelector" in document &&
!!document.querySelector("meta[name=darkreader]")
Browser benchmarks #
Performance:
- https://browserbench.org/
- https://krakenbenchmark.mozilla.org/
- https://www.wirple.com/bmark/
- https://web.basemark.com/
Features:
For testing ads-blocking #
WARN: some of these websites may distribute malvertising, pirated or NSFW content. Load at your own risk!
- adblock-tester.com
- coveryourtracks.eff.org
- https://d3ward.github.io/toolz/src/adblock
- https://blockads.fivefilters.org/
Samples in the wild:
- google.com
- Features first-party ads, blockable via generic cosmetic rules in uBlock Origin
- youtube.com
- video sample
- Features first-party ads
- bild.de
- Features anti-ad-blocking tech
- nytimes.com
- Features annoying cookies / trackers banner
- forbes.com
- Features annoying cookies / trackers dialog, and huge ad banners
- businessinsider.com
- Trackers/cookies dialog, notification spam
- g4media.ro
- Trackers/cookie dialog, notification spam, Google ads
- technoreels.com
- WARN: malvertising, intrusive ads, anti-ad-blocking tech (kicking in after several seconds)
- lookmovie.io
- WARN: pirated content, illegal software; anti-ad-blocking tech
- lostmediawiki.com
- Anti-ad-blocking tech
- multics.eu
- Anti-ad-blocking tech
Progressive Web Apps (PWAs) #
- https://web.dev/progressive-web-apps/
- https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps
Wrap web pages as desktop apps #
Using: https://github.com/jiahaog/nativefier
nativefier \
--maximize \
-u "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:76.0) Gecko/20100101 Firefox/76.0" \
--internal-urls ".*.google.com.*" \
--name "YouTube Music" \
"https://music.youtube.com/"
nativefier \
-u "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:76.0) Gecko/20100101 Firefox/76.0" \
--maximize \
--counter \
--name "Twitter" \
"https://twitter.com"
nativefier \
-u "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:76.0) Gecko/20100101 Firefox/76.0" \
--maximize \
--counter \
--name "Gitter" \
"https://gitter.im"
Browser comparisons #
Chrome vs Firefox:
