Web

| comments

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:

Features:

For testing tracking & ads blocking #

Progressive Web Apps (PWAs) #

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 #