PURE CSS ART GALLERY

Loading artwork...

Ben Evans

www.benevansdesign.co.uk

No images, just CSS. The final part to my pointless trilogy

Still Life = https://codepen.io/ivorjetski/pen/xMJoYO Portrait = https://codepen.io/ivorjetski/pen/dBYWWZ

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 84.0	Windows 10 64-bit	448.93ms	16.42ms	39.86ms	65	-
Chrome 83.0	Windows 10 64-bit	442.72ms	18.57ms	55.83ms	45	-
Chrome 89.0	Windows 10 64-bit	364.00ms	21.17ms	35.18ms	26	-
Chrome 83.0	OS X 10.15.5 64-bit	406.27ms	9.33ms	38.49ms	17	-
Chrome 84.0	OS X 10.15.5 64-bit	313.80ms	9.82ms	34.59ms	14	-
Chrome 84.0	OS X 10.15.6 64-bit	274.34ms	9.21ms	37.58ms	13	-
Chrome 84.0	OS X 10.14.6 64-bit	308.37ms	10.18ms	25.27ms	12	-
Firefox 82.0	Windows 10 64-bit	216.09ms	11.27ms	52.27ms	11	-
Firefox 81.0	Windows 10 64-bit	104.00ms	9.50ms	39.80ms	10	-
Chrome 84.0	Linux 64-bit	435.23ms	13.99ms	44.35ms	10	-
Firefox 80.0	Windows 10 64-bit	123.20ms	9.30ms	27.50ms	10	-
Chrome Mobile 84.0	Android 10	444.48ms	25.16ms	54.60ms	10	-
Chrome 83.0	OS X 10.14.6 64-bit	281.11ms	9.57ms	30.53ms	9	-
Firefox 83.0	Windows 10 64-bit	146.88ms	12.38ms	35.50ms	8	-
Firefox 79.0	Windows 10 64-bit	183.00ms	10.75ms	82.13ms	8	-
Android Browser 4.0	Android 10	397.21ms	16.79ms	38.01ms	7	-
Safari 14.0.3	OS X 10.15.6	193.14ms	5.86ms	29.57ms	7	-
Firefox 86.0	Windows 10 64-bit	491.14ms	12.86ms	52.29ms	7	-
Chrome 83.0	OS X 10.15.4 64-bit	564.58ms	9.22ms	40.61ms	7	-
Firefox 85.0	Windows 10 64-bit	427.17ms	9.50ms	57.33ms	6	-
Safari 13.1.1	OS X 10.15.5	258.83ms	7.17ms	24.50ms	6	-
Chrome Mobile 83.0	Android 10	1316.22ms	38.05ms	85.62ms	6	-
Chrome 83.0	Linux 64-bit	734.91ms	11.98ms	39.04ms	6	-
Chrome Mobile 83.0	Android 9	653.72ms	35.75ms	72.73ms	6	-
Firefox 78.0	Windows 10 64-bit	185.83ms	14.17ms	70.00ms	6	-
Chrome 89.0	OS X 11.2.3 64-bit	297.16ms	10.14ms	19.76ms	5	-
Firefox 77.0	OS X 10.15	198.20ms	30.60ms	71.40ms	5	-
Firefox 78.0	Linux 64-bit	235.40ms	17.80ms	114.40ms	5	-
Safari 13.1.1	iOS 13.5.1	971.40ms	12.60ms	16.20ms	5	-
Chrome Mobile 84.0	Android 9	948.46ms	44.48ms	86.32ms	5	-
Safari 13.1.2	OS X 10.15.4	229.80ms	12.80ms	17.60ms	5	-
Firefox 84.0	Windows 10 64-bit	178.00ms	9.25ms	25.50ms	4	-
Chrome 80.0	Linux 64-bit	818.66ms	17.01ms	41.24ms	4	-
Chrome 83.0	OS X 10.13.6 64-bit	442.14ms	20.74ms	39.13ms	4	-
Firefox 77.0	Windows 10 64-bit	223.50ms	36.50ms	96.50ms	4	-
Firefox 78.0	OS X 10.14	128.75ms	9.25ms	33.25ms	4	-
Safari 14.0	iOS 14.0	215.25ms	12.50ms	14.75ms	4	-
Firefox 80.0	OS X 10.15	287.50ms	10.00ms	65.25ms	4	-
Chrome 84.0	Windows Server 2008 R2 / 7 64-bit	352.56ms	20.78ms	80.93ms	4	-
Firefox 79.0	Ubuntu 64-bit	98.67ms	15.33ms	21.00ms	3	-
Chrome 57.0	Linux 64-bit	471.59ms	14.51ms	43.34ms	3	-
Firefox 81.0	Ubuntu 64-bit	246.67ms	18.00ms	62.00ms	3	-
Chrome 81.0	Linux 64-bit	383.95ms	20.89ms	43.19ms	3	-
Chrome 81.0	Windows 10 64-bit	450.59ms	14.91ms	30.95ms	3	-
Safari 14.0.2	OS X 10.15.6	169.67ms	8.00ms	19.00ms	3	-
null null	null	576.85ms	22.25ms	29.33ms	3	-
Firefox 76.0	Windows 10 64-bit	376.67ms	15.33ms	59.33ms	3	-
Opera 68.0	Windows 10 64-bit	256.28ms	16.18ms	31.76ms	3	-
Firefox 87.0	Windows 10 64-bit	279.67ms	15.00ms	32.67ms	3	-
Chrome 89.0	OS X 10.15.7 64-bit	185.86ms	8.89ms	18.60ms	3	-