PURE CSS ART GALLERY

Loading artwork...

Sarah Fossheim

Tutorial: https://fossheim.io/writing/posts/css-macintosh/

Edit on Codepen

Async `<link>`

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

localStorage

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

Cache-API

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

Browser	OS	Async	localStorage	Cache-API	Tests	Improvement
Chrome 103.0	Windows 10 64-bit	381.91ms	1.27ms	7.14ms	14	-
Chrome 97.0	Windows 10 64-bit	264.11ms	1.50ms	6.31ms	7	-
Chrome 103.0	OS X 10.15.7 64-bit	267.11ms	0.79ms	4.77ms	7	-
Chrome 97.0	OS X 10.15.7 64-bit	210.88ms	1.00ms	4.38ms	5	-
Chrome 100.0	OS X 10.15.7 64-bit	256.38ms	0.90ms	6.32ms	5	-
Chrome 96.0	OS X 10.15.7 64-bit	215.73ms	0.97ms	6.03ms	4	-
Chrome 96.0	Windows 10 64-bit	369.10ms	1.92ms	6.95ms	4	-
Chrome 98.0	OS X 10.15.7 64-bit	163.52ms	1.40ms	5.35ms	4	-
Chrome 100.0	Windows 10 64-bit	388.07ms	0.93ms	6.13ms	3	-
Chrome 102.0	Windows 10 64-bit	195.70ms	1.90ms	8.27ms	3	-
Firefox 102.0	Windows 10 64-bit	224.33ms	0.67ms	10.67ms	3	-
null null	null	1110.73ms	9.16ms	125.67ms	2	-
Chrome 96.0	Linux 64-bit	332.90ms	1.80ms	13.20ms	2	-
Safari 15.2	OS X 10.15.7	464.00ms	1.00ms	17.00ms	2	-
Chrome 99.0	OS X 10.15.7 64-bit	299.40ms	0.60ms	4.95ms	2	-
Chrome 99.0	Windows 10 64-bit	228.60ms	0.80ms	2.50ms	2	-
Firefox 98.0	Windows 10 64-bit	189.00ms	1.00ms	6.50ms	2	-
Chrome 101.0	OS X 10.15.7 64-bit	173.95ms	0.75ms	3.75ms	2	-
Chrome Mobile 101.0	Android 10	567.10ms	8.65ms	19.10ms	2	-
Safari 15.5	OS X 10.15.7	180.00ms	1.00ms	8.00ms	2	-
Chrome 101.0	Windows 10 64-bit	395.75ms	1.00ms	5.05ms	2	-
Firefox 102.0	Linux 64-bit	279.50ms	5.00ms	24.00ms	2	-
Chrome 87.0	Linux 64-bit	156.79ms	0.64ms	5.45ms	1	-
Chrome 87.0	Windows 10 64-bit	234.15ms	2.43ms	6.93ms	1	-
Chrome Mobile 90.0	Android 11	228.10ms	6.50ms	17.60ms	1	-
Safari 15.1	OS X 10.15.7	179.00ms	1.00ms	6.00ms	1	-
Firefox 95.0	Windows 10 64-bit	683.00ms	1.00ms	4.00ms	1	-
Chrome 98.0	Windows 10 64-bit	216.80ms	0.40ms	2.60ms	1	-
Safari 14.1.2	iOS 14.8.1	197.00ms	1.00ms	7.00ms	1	-
Chrome Mobile 96.0	Android 9	389.70ms	10.80ms	23.10ms	1	-
Safari 15.4	OS X 10.15.7	323.00ms	1.00ms	4.00ms	1	-
Safari 15.2	iOS 15.2	618.00ms	2.00ms	23.00ms	1	-
Chrome 97.0	OS X 10.14.1 64-bit	606.70ms	1.30ms	5.30ms	1	-
Chrome 100.0	Linux 64-bit	322.80ms	2.70ms	8.10ms	1	-
Chrome 98.0	Linux 64-bit	305.20ms	1.10ms	4.80ms	1	-
Chrome Mobile 97.0	Android 10	429.50ms	2.90ms	27.70ms	1	-
Firefox 97.0	Windows 10 64-bit	201.00ms	4.00ms	13.00ms	1	-
Firefox 98.0	Linux 64-bit	303.00ms	7.00ms	61.00ms	1	-
Safari 15.3	iOS 15.3	591.00ms	3.00ms	16.00ms	1	-
Chrome Mobile 98.0	Android 8.0.0	198.20ms	9.70ms	20.90ms	1	-
Firefox 98.0	OS X 10.15	106.00ms	0.00ms	4.00ms	1	-
Firefox 100.0	Windows 10 64-bit	219.00ms	1.00ms	5.00ms	1	-
Chrome 100.0	OS X 10.14.6 64-bit	195.90ms	1.40ms	7.20ms	1	-
Chrome 103.0	Linux 64-bit	340.20ms	1.70ms	2.90ms	1	-
Firefox 100.0	Ubuntu 64-bit	280.00ms	3.00ms	23.00ms	1	-
Firefox 101.0	Windows 10 64-bit	192.00ms	1.00ms	6.00ms	1	-
Chrome 102.0	Linux 64-bit	457.60ms	0.60ms	2.30ms	1	-
Opera 85.0	Windows Server 2008 R2 / 7 64-bit	245.20ms	2.40ms	7.70ms	1	-
Chrome 102.0	Windows Server 2008 R2 / 7	247.00ms	4.00ms	10.00ms	1	-
Firefox 101.0	Ubuntu 64-bit	91.00ms	0.00ms	7.00ms	1	-