1 Million HTML Elements: What Will Happen With a Web Page?

Описание

1 vs 1,000,000 HTML elements.

How many elements can browsers show?
Starting with just one element, I progressively add more, increasing by a factor of ten with each test until I reach one million HTML elements. Along the way, I incorporate visual graphics to help visualize the performance metrics we're interested in, such as Speed Index, First Contentful Paint, Largest Contentful Paint, and Total Blocking Time (TBT).

Throughout the video, I demonstrate the impact of each iteration, running tests and analyzing the results. I explore the differences observed in Webpagetest and PageSpeed Insights for both desktop and mobile versions. I meticulously document all the numbers, which are conveniently presented in an Excel file for your reference.

In the end, I present a comprehensive table summarizing all the findings, showcasing the significant impact of adding one million HTML elements to a web page

My Instagram: https://www.instagram.com/web_for_devs/
WebPageTest: https://www.webpagetest.org/
PageSpeed Insights: https://pagespeed.web.dev/

Do not forget to like the video :)

00:00 - Intro
00:18 - Metrics
00:28 - Project Structure
01:03 - 1 HTML element
01:31 - 10 HTML elements
01:57 - 100 HTML elements
02:23 - 1000 HTML elements
02:54 - 10 000 HTML elements
03:35 - 100 000 HTML elements
04:09 - 1,000,000 HTML elements