{"id":144485,"date":"2023-02-09T15:00:28","date_gmt":"2023-02-09T15:00:28","guid":{"rendered":"https:\/\/www.searchenginewatch.com\/?p=144485"},"modified":"2023-02-10T10:00:04","modified_gmt":"2023-02-10T10:00:04","slug":"seven-tips-to-optimize-page-speed-in-2023","status":"publish","type":"post","link":"https:\/\/searchenginewatch.com\/2023\/02\/09\/seven-tips-to-optimize-page-speed-in-2023\/","title":{"rendered":"Seven tips to optimize page speed in 2023"},"content":{"rendered":"<div class=\"well\">\n<h3><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-144494\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Tips-to-optimize-page-speed-in-2023-1.png\" alt=\"Tips-to-optimize-page-speed-in-2023\" width=\"728\" height=\"233\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Tips-to-optimize-page-speed-in-2023-1.png 728w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Tips-to-optimize-page-speed-in-2023-1-300x96.png 300w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Tips-to-optimize-page-speed-in-2023-1-768x246.png 768w\" sizes=\"auto, (max-width: 728px) 100vw, 728px\" \/><\/h3>\n<h3>30-second summary:<\/h3>\n<ul>\n<li>There has been a gradual increase in Google&#8217;s impact of page load time on website rankings<\/li>\n<li>Google has introduced the three Core Web Vitals metrics as ranking factors to measure user experience<\/li>\n<li>The following steps can help you get a better idea of the performance of your website through multiple tests<\/li>\n<\/ul>\n<\/div>\n<p>A fast website not only delivers a better experience but can also increase conversion rates and improve your search engine rankings. Google has introduced the three <a href=\"https:\/\/web.dev\/vitals\/\" target=\"_blank\" rel=\"noopener\">Core Web Vitals<\/a> metrics to measure user experience and is <a href=\"https:\/\/www.debugbear.com\/docs\/core-web-vitals-ranking-factor?utm_campaign=sew1\" target=\"_blank\" rel=\"noopener\">using them as a ranking factor<\/a>.<\/p>\n<p>Let\u2019s take a look at what you can do to test and optimize the performance of your website.<\/p>\n<h2>Start in Google Search Console<\/h2>\n<p>Want to know if optimizing Core Web Vitals is something you should be thinking about? Use the page experience report in <a href=\"https:\/\/www.debugbear.com\/blog\/search-console-core-web-vitals\" target=\"_blank\" rel=\"noopener\">Google Search Console<\/a> to check if any of the pages on your website are loading too slowly.<\/p>\n<p>Search Console shows data that Google collects from real users in Chrome, and this is also the data that\u2019s used as a ranking signal. You can see exactly what page URLs need to be optimized.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-144486 size-full\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Start-in-Google-Search-Console.png\" alt=\"Optimize-to-Start-in-Google-Search-Console\" width=\"624\" height=\"452\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Start-in-Google-Search-Console.png 624w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Start-in-Google-Search-Console-300x217.png 300w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/p>\n<h2>Run a website speed test<\/h2>\n<p>Google\u2019s real user data will tell you how fast your website is, but it won\u2019t provide an analysis that explains why your website is slow.<\/p>\n<p><a href=\"https:\/\/www.debugbear.com\/test\/website-speed?utm_campaign=sew1\" target=\"_blank\" rel=\"noopener\">Run a free website speed test<\/a> to find out. Simply enter the URL of the page you want to test. You\u2019ll get a detailed performance report for your website, including recommendations on how to optimize it.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-144487 size-full\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Run-a-website-speed-test.png\" alt=\"Run-a-website-speed-test-for-optimization\" width=\"624\" height=\"601\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Run-a-website-speed-test.png 624w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Run-a-website-speed-test-300x289.png 300w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/p>\n<h2>Use priority hints to optimize the Largest Contentful Paint<\/h2>\n<p><a href=\"https:\/\/www.debugbear.com\/blog\/priority-hints?utm_campaign=sew1\" target=\"_blank\" rel=\"noopener\">Priority Hints<\/a> are a new browser feature that came out in 2022. It allows website owners to indicate how important an image or other resource is on the page.<\/p>\n<p>This is especially important when optimizing the <a href=\"https:\/\/web.dev\/lcp\/\" target=\"_blank\" rel=\"noopener\">Largest Contentful Paint<\/a>, one of the three Core Web Vitals metrics. It measures how long it takes for the main page content to appear after opening the page.<\/p>\n<p>By default, browsers assume that all images are low priority until the page starts rendering and the browser knows which images are visible to the user. That way bandwidth isn\u2019t wasted on low-priority images near the bottom of the page or in the footer. But it also slows down important images at the top of the page.<\/p>\n<p>Adding a fetchpriority=&#8221;high&#8221; attribute to the img element that\u2019s responsible for the Largest Contentful Paint ensures that it\u2019s downloaded quickly.<\/p>\n<h2>Use native image lazy loading for optimization<\/h2>\n<p>Image lazy loading means only loading images when they become visible to the user. It\u2019s a great way to help the browser focus on the most important content first.<\/p>\n<p>However, image lazy loading can also slow cause images to take longer to load, especially when using a JavaScript lazy loading library. In that case, the browser first needs to load the JavaScript library before starting to load images. This long request chain means that it takes a while for the browser to load the image.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-144488 size-full\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Use-native-image-lazy-loading.png\" alt=\"Use-native-image-lazy-loading-for-optimization\" width=\"624\" height=\"308\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Use-native-image-lazy-loading.png 624w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Use-native-image-lazy-loading-300x148.png 300w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/p>\n<p>Today browsers support <a href=\"https:\/\/css-tricks.com\/native-lazy-loading\/\" target=\"_blank\" rel=\"noopener\">native lazy loading<\/a> with the loading=&#8221;lazy&#8221; attribute for images. That way you can get the benefits of lazy loading without incurring the cost of having to download a JavaScript library first.<\/p>\n<h2>Remove and optimize render-blocking resources<\/h2>\n<p><a href=\"https:\/\/www.debugbear.com\/blog\/render-blocking-resources?utm_campaign=sew1\" target=\"_blank\" rel=\"noopener\">Render-blocking resources<\/a> are network requests that the browser needs to make before it can show any page content to the user. They include the HTML document, CSS stylesheets, as well as some JavaScript files.<\/p>\n<p>Since these resources have such a big impact on page load time you should check each one to see if it\u2019s truly necessary. The async keyword on the HTML script tag lets you load JavaScript code without blocking rendering.<\/p>\n<p>If a resource has to block rendering check if you can optimize the request to load the resource more quickly, for example by improving compression or loading the file from your main web server instead of from a third party.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-144489 size-full\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Remove-and-optimize-render-blocking-resources.png\" alt=\"Remove-and-optimize-render-blocking-resources\" width=\"624\" height=\"328\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Remove-and-optimize-render-blocking-resources.png 624w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Remove-and-optimize-render-blocking-resources-300x158.png 300w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/p>\n<h2>Optimize with the new interaction to Next Paint metric<\/h2>\n<p>Google has announced a new metric called <a href=\"https:\/\/web.dev\/inp\/\" target=\"_blank\" rel=\"noopener\">Interaction to Next Paint<\/a>. This metric measures how quickly your site responds to user input and is likely to become one of the Core Web Vitals in the future.<\/p>\n<p>You can already see how your website is doing on this metric using tools like <a href=\"https:\/\/pagespeed.web.dev\/\" target=\"_blank\" rel=\"noopener\">PageSpeed Insights<\/a>.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-144491 size-full\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Be-ready-for-the-new-Interaction-to-Next-Paint-metric.png\" alt=\"Optimize-with-new-Interaction-to-Next-Paint-metric\" width=\"624\" height=\"360\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Be-ready-for-the-new-Interaction-to-Next-Paint-metric.png 624w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Be-ready-for-the-new-Interaction-to-Next-Paint-metric-300x173.png 300w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/p>\n<h2>Continuously monitor your site performance<\/h2>\n<p>One-off site speed tests can identify performance issues on your website, but they don\u2019t make it easy to keep track of your test results and confirm that your optimizations are working.<\/p>\n<p>DebugBear continuously monitors your website to check and alerts you when there\u2019s a problem. The tool also makes it easy to show off the impact of your work to clients and share test results with your team.<\/p>\n<p><a href=\"https:\/\/www.debugbear.com\/?utm_campaign=sew1\" target=\"_blank\" rel=\"noopener\">Try DebugBear with a free 14-day trial.<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-144490\" src=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Continuously-monitor-your-site-performance.png\" alt=\"Continuously-monitor-your-site-performance\" width=\"624\" height=\"348\" srcset=\"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Continuously-monitor-your-site-performance.png 624w, https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Continuously-monitor-your-site-performance-300x167.png 300w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Over the last few years Google has increased the impact that page load time has on how high your website ranks. Try some of these tips to make your website fast and take advantage of new browser features.<\/p>\n","protected":false},"author":1092,"featured_media":144494,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,5],"tags":[28090,22,217],"content_type":[],"class_list":["post-144485","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-content","category-seo","tag-core-web-vitals-cwv","tag-seo","tag-technical-seo"],"acf":{"tad_independentcommercial":"Commercial","tad_content_format":"Native Article"},"post_info":{"name":"idris.nagri@blenheimchalcot.com idris.nagri@blenheimchalcot.com","title":"","thumbnail_url":"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2023\/02\/Tips-to-optimize-page-speed-in-2023-1.png","category":"Content","timeago":"3y"},"_links":{"self":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/posts\/144485","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/users\/1092"}],"replies":[{"embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/comments?post=144485"}],"version-history":[{"count":0,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/posts\/144485\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/media\/144494"}],"wp:attachment":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/media?parent=144485"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/categories?post=144485"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/tags?post=144485"},{"taxonomy":"content_type","embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/content_type?post=144485"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}