26 nov 2020

BROWSER BENCHMARKS, SCOPRI I BROWSER PIÙ UTILIZZATI NEL MONDO E PERCHÈ

Non stai usando Internet Explorer vero? :) Lo ammettiamo in KUMBE non ci piace molto, ma le motivazioni sono oggettive, ormai il caro vecchio IE non supporta un sacco di novità!

Le statistiche di diffusione dei browser maggiormente utilizzati vengono aggiornate ogni mese e mostrano una percentuale teorica della diffusione dei singoli browser nel mondo. Qual è il browser più gettonato? Sicuramente in molti già lo sanno, ma oggi ti spiego il perchè. Per questi test sono stati scelti i 6 browser più utilizzati al mondo:

Chrome v. 86.0.4240.183 (su PC con Windows 10)
Opera GX v. 71.0.3770.323 (su PC con Windows 10)
Firefox v. 82.0.3 (su PC con Windows 10)
Edge v. 86.0.622.63 (su PC con Windows 10);
Safari v. 14.0 (su Mac con macOS Catalina)
Internet Explorer 11 (su PC con Windows 10)

2020	CHROME	EDGE/IE	FIREFOX	SAFARI	OPERA
OTTOBRE	80.4%	5.2%	7.1%	3.7%	2.1%

Si nota subito come CHROME sia decisamente il browser più amato e utilizzato dal mondo del web. Ma andiamo nello specifico!

COMPONENTI

Di seguito sono dettagliati i componenti dei due computer sui quali i benchmark sono stati eseguiti.

Specifiche PC

CPU: Intel Core i5-4690 3.4 Ghz (Quad core)
RAM: 8 GB 1600 Mhz DDR3
GPU: Nvidia Geforce GTX970 4GB VRAM
HDD: SSD Crucial MX100 240GB
OS: Windows 10 x64 (build 1903)

Specifiche MAC

CPU: Intel Core i5 1.4 Ghz (Dual core)
RAM: 4GB 1600 Mhz DDR3
GPU: Intel HD Graphics 5000 1536MB
HDD: SSD Sandisk 250 GB
OS: macOS Catalina 10.15.7

Benchmarks

HTML5TEST

HTML5test è un’applicazione web per valutare l’accuratezza dei web browser nell’implementare gli standard dell’HTML5 e Web SQL Database, così come lo standard WebGL.

Il punteggio del test HTML5test è un’indicazione di come il browser supporta lo standard HTML5 e le relative specifiche, è un numero intero fino a 555 punti in base al supporto delle funzionalità dato dal browser in test.

HTML5test valuta il supporto del browser verso lo storage web, le API di geolocalizzazione W3C, elementi HTML5-specifici (includendo l’elemento canvas) e altre funzionalità. Non valuta, invece, la conformità del web browser verso altri standard web, come i Cascading Style Sheets (CSS), ECMAScript, Scalable Vector Graphics (SVG), o Document Object Model.

Fonte HTML5test

KRAKEN 1.1

Kraken è un benchmark delle performance JavaScript creato da Mozilla che analizza e misura la velocità di una serie di casi di test estrapolati da applicazioni del mondo reale e librerie. Kraken utilizza un test che si basa sul benchmark SunSpider, i risultati che dà sono riportati in millisecondi e sono precisi al 95% (il minore è il migliore).

I casi di test includono:

un’implementazione dell’algoritmo di ricerca A* (astar)
processing audio utilizzando la libreria DSP.js di Cobran Brook (beat-detection, dft, fft, oscillator)
routine di filtraggio delle immagini, includendo codice della libreria Pixastic di Jacob Seidelin (gaussian-blur, darkroom, desaturate)
parsing JSON, includendo dati da Tinderboxpushlog (parse-financial, stringify-tinderbox)
routine di crittografia della libreria JavaScript Crypto di Stanford (crypto-aes, crypto-ccm, crypto-pbkdf2, crypto-sha256-iterative)

Fonte Kraken benchmark

OCTANE 2.0

Octane 2.0 consiste di una serie di 17 test, 4 in più di Octane v1. Questo test copre in sostanza la maggior parte dei casi d’uso incontrati nel web reale. E' stato introdotto perché il motore di JavaScript dovrebbe soprattutto performare su codice del mondo reale e non solo su benchmark sintetici.

Richards: benchmark di simulazione del kernel del sistema operativo (scritto originariamente in BCP da Martin Richards). Il focus principale è su caricamento e salvataggio delle proprietà e chiamate di metodi/funzioni mentre il focus secondario è su ottimizzazione del codice ed eliminazione di codice ridondante
Deltablue: risolutore di vincoli unidirezionali, scritto originariamente da John Maloney e Mario Wolczko. Il focus principale è sul polimorfismo mentre quello secondario è sullo stile di programmazione OO (Object Oriented)
Raytrace: benchmark ray tracer basato sul codice di Adam Burmister. Il focus principale è su funzioni di applicazione e su oggetti di argomento mentre quello secondario è su oggetti, librerie di prototipo e modelli di creazione
Regex: benchmark per le espressioni regolari generato estraendo le operazioni da 50 dei più popolari siti web. Il focus principale è sulle espressioni regolari
NavierStokes: risolutore di equazioni 2D NavierStokes, manipola in modo pesante gli array a doppia precisione basato sul codice di Oliver Hunt. Il focus principale è la lettura e la scrittura di array numerici, il focus secondario è sulla matematica in virgola mobile.
Crypto: benchmark di criptazione e decriptazione basato sul codice di Tom Wu. Il focus principale è sulle operazioni a livello di bit
Splay: benchmark di manipolazione dei dati che si occupa degli splay trees ed esercita il sottosistema automatico di gestione della memoria. Il focus principale è sulla creazione veloce di oggetti e sulla distruzione degli stessi
SplayLatency: il test Splay stressa il sottosistema di Garbage Collection di una Virtual Machine. SplayLatency istruisce il codice esistente di Splay con checkpoint di misurazione frequenti. Una lunga pausa tra checkpoint è un’indicazione di un alta latenza del GC. Questo test misura la frequenza delle pause di latenza e le classifica in contenitori penalizzando pause lunghe e frequenti con un punteggio basso. Il focus principale è sulla latenza del Garbage Collector
EarleyBoyer: benchmark di Classic Scheme, tradotto in JavaScript dal compilatore Scheme2js di Florian Loitsch. Il focus principale è la creazione/distruzione di oggetti veloce e quello secondario gli argomenti e le cosiddette “closures”
pdf.js: lettore PDF implementato in JavaScript da Mozilla, misura la decodifica e il tempo di interpretazione. Il focus principale è la manipolazione di array e array tipizzati, quello secondario le operazioni matematiche e a livello di bit ed il supporto per future funzionalità dei linguaggi (come le promises)
Mandreel: esegue il 3D Bullet Physics Engine portato da C++ a JavaScript con Mandreel. Il focus principale è l’emulazione
MandreelLatency: simile al test SplayLatency, questo test utilizza il benchmark Mandreel con checkpoint di misura frequenti. Dato che Mandreel stressa il compilatore della macchina virtuale, questo test dà un’indicazione della latenza introdotta dal compilatore. Lunghe pause tra i checkpoint di misura abbassano il punteggio finale. Il focus principale è la latenza del compilatore
GB Emulator: emula l’architettura portabile della console ed esegue una simulazione 3D pesante, tutto in JavaScript. Il focus principale è l’emulazione
Code loading: misura quanto velocemente il motore JavaScript può iniziare ad eseguire codice dopo aver caricato un programma JavaScript grande (es. i social widget). I sorgenti di questo test derivano da librerie open source (Closure, jQuery). Il focus principale è il parsing e la compilazione di JavaScript
Box2DWeb: basato su Box2DWeb, il popolare motore fisico 2D scritto originariamente da Erin Catto e portato in JavaScript. Il focus principale è la matematica in virgola mobile e quello secondario le proprietà che contengono double e quelle accessorie
Zlib: il test as.js/Emscripten zlib della suite Mozilla Emscripten. Il focus principale sono la compilazione e l’esecuzione di codice
Typescript: il compiler di Microsoft TypeScript è un’applicazione complessa. Il test misura il tempo che Typescript impiega per compilare sé stesso ed è un modo per capire come la VM gestisce applicazioni JavaScript complesse e di varie dimensioni. Il focus principale è di eseguire applicazioni pesanti e complesse

Fonte Octane

JETSTREAM 2

JetStream 2 combina insieme una varietà di benchmark JavaScript e Web Assembly, ricoprendo un set di workload avanzati e di tecniche di programmazione, e riporta un singolo valore basato su una media geometrica tra i valori ottenuti. JetStream 2 ricompensa browser che si avviano velocemente, eseguono il codice velocemente e continuano a funzionare in modo fluido. I benchmark hanno un singolo punteggio che equivale come peso, le metriche si basano su un’esecuzione multipla di N iterazioni dell’operazione richiesta. JetStream 2 include un benchmark di JavaScript di nome WSL, questo è un’implementazione del linguaggio di shading della GPU scritto in JavaScript. Le metriche utilizzate sono due: il tempo che richiede per compilare la libreria standard WSL, e il tempo che richiede per eseguire un test specifico. Include inoltre una serie di test che fanno parte anche di alte suite: SunSpider, Octane 2, JetStream 1, ARES-6, benchmark di Web Tooling e Kraken. Sono stati poi introdotti una serie di benchmark specifici per misura le performance di Web Assembly, Web Workers, Promises, iterazioni asincrone, espressioni regolari unicode e parsing di JavaScript.

Fonte Jetstream 2

WEBXPRT 3

WebXPRT 3 è un benchmark per browser che compara le performance di quasi tutti i dispositivi abilitati al web. Contiene 6 scenari con HTML5 e JavaScript creati per simulare i compiti eseguiti ogni giorno. WebXPRT è lo standard dei benchmark web, è gratis e funziona dal browser, il suo intervallo di confidenza è di +/- 5 sul valore ottenuto dal benchmark.

I test effettuati comprendono:

miglioramento di foto (ms): misura il tempo per applicare tre effetti (sharpen, emboss e glow) a 6 foto in totale
organizzazione di album con AI (ms): misura il tempo che richiede il controllo di facce e la classificazione di immagini in un set di 5 foto
prezzo delle stock option (ms): calcola e visualizza viste grafiche di un portfolio delle azioni utilizzando Canvas, SVG e dygraph.js
criptazione di note e scan OCR (ms): cripta delle note nello storage locale e scansiona una ricevuta utilizzando l’OCR
grafi di vendita (ms):forniscono un’applicazione basata su web che visualizza un insieme di viste di dati di vendita
compiti online (ms): misura il tempo che richiede per completare il sequenziamento di 8 DNA e fa lo il controllo ortografico di un saggio
funzionalità HTML5 (Canvas, CanvasText, Canvas2dContext, WebGL, Audio, Video, Ogg, H264, WebM, GeolocationAPI, LocalStorage, SVG, WebWorkers, Uint32ArraySupport)

Fonte Webxprt

Tabella Riepilogativa

	CHROME	FIREFOX	EDGE	SAFARI	OPERA (GX)	IE11
HTML5test	528/555	514/555	528/555	489/555	523/555	312/555
Kraken 1.1	1048.5 ms +/- 1.5%	1143.0ms +/- 2.4%	1225.3ms +/- 2.4%	1447 ms +/- 2.9%	1047.0ms +/- 0.4%	2692.9ms +/- 0.7%
Octane 2.0	39232	26982	33416	20441	37106	12343
JetStream 2.0	99828	76082	94687	73609	99827	ND
WebXPRT 3	162	189	166	135	145	93

CONCLUSIONI

I dati sono aggiornati all’11 novembre 2020, data di scrittura di questo articolo, i punti interessanti dati da questa analisi approfondita delle performance dei browser più utilizzati nel mondo sono:

Chrome vince 3 test su 5 attestandosi come il migliore e più performante browser della lista;
Opera (GX) si avvicina in molti test ai risultati di Chrome dimostrandosi migliore per il benchmark Kraken;
Edge si comporta in modo buono avvicinandosi portandosi ad un terzo posto del podio virtuale offrendo lo stesso supporto all’HTML5 di Chrome;
Firefox si comporta in modo discreto portandosi a casa solo il test WebXPRT 3;
Safari (su Mac) risulta il browser moderno peggiore della suite;
Internet Explorer 11 è stato scelto come comparativa perché è installato di default su tutti i computer con Windows nel mondo, si può notare ad occhio nudo la differenza prestazionale rispetto agli altri browser. Si noti come non è stato possibile effettuare il test con il benchmark JetStream 2.0 perché non supportato.

Ora hai tutti i dati per valutare e scegliere quale browser utilizzare per la navigazione. La scelta dipende da te e dalle tue necessità, noi sicuramente quello che possiamo suggerirti è quale browser NON utilizzare, ovvero Internet Explorer ;)

Se hai bisogno di altre informazioni o consulenze contattaci in totale libertà scrivendoci una mail!

CONTATTA ORA LA TRIBU' ISCRIVITI ALLA NEWSLETTER