For example, the news text on a news page should load before embeds for a Twitter feed or advertisements. In a well-designed page, the key first-party content will be the focus of the page, while the third-party embeds will occupy side-bars or appear after the first-party content.įor the best user experience, the main content should load quickly and before any other supporting content. To efficiently use third-party embeds and reduce their performance impact, follow the guidelines below. Third-party embeds can negatively impact performance, but they also offer important functionalities. You can use this opportunity to remove any redundant code. It is a good practice to periodically audit the performance impact of your embeds and third-party code because embed source code may change. The audit is available through Chrome DevTools under the Lighthouse tab. Reduce the impact of third-party code Lighthouse audit shows the list of third-party providers a page uses, with size and main-thread blocking time. Performance monitoring tools such as Lighthouse and Chrome DevTools help to measure the impact of third-party embeds on performance. They take more time to load and keep the main thread busy when executing. Many popular embeds include over 100 KB of JavaScript, sometimes even going up to 2 MB. Performance impact of third-party embeds #
This can make the third-party embeds heavy and affect the performance of the page by delaying its first-party content. Some providers also use a script snippet that dynamically injects an to pull other content in. Third-party providers offer HTML snippets often consisting of an that pulls in a page composed of markup, scripts, and stylesheets. Third-party embeds are typically loaded in elements on the page. Restaurant, park, and event venue pages often embed maps.Organizations with active Twitter or social media accounts embed feeds from these accounts to their web pages to engage and reach out to more people.Websites related to sports, news, entertainment, and fashion use videos to augment textual content.What is an embed #Ī third-party embed is any content displayed on your site that is:Įmbeds are frequently used in the following: This ensures that all the critical content gets indexed by search engines. It's best to use the techniques described in this post to load only offscreen or non-primary page content.
0 kommentar(er)
