{"id":14710,"date":"2017-11-21T13:00:47","date_gmt":"2017-11-21T13:00:47","guid":{"rendered":"https:\/\/www.certificationanswers.com\/?p=14710"},"modified":"2017-11-21T13:00:47","modified_gmt":"2017-11-21T13:00:47","slug":"the-first-step-to-optimize-the-critical-rendering-path-is-to","status":"publish","type":"post","link":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/","title":{"rendered":"The first step to optimize the critical rendering path is to:"},"content":{"rendered":"<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">The first step to optimize the critical rendering path is to:<\/span><\/p>\n<p>&nbsp;<\/p>\n<p style=\"padding-left: 30px;\">minimize number of critical resources: eliminate them, defer their download, mark them as async, and so on<\/p>\n<p style=\"padding-left: 30px;\"><span style=\"color: #008000;\"><strong>analyze and characterize your critical path: number of resources, bytes, length<\/strong><\/span><\/p>\n<p style=\"padding-left: 30px;\">optimize the order in which the remaining critical resources are loaded: download all critical assets as early as possible to shorten the critical path length<\/p>\n<p style=\"padding-left: 30px;\">optimize the number of critical bytes to reduce the download time (number of roundtrips)<\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">Explanation: <\/span><\/p>\n<p><span style=\"font-weight: 400;\">The general sequence of steps to optimize the critical rendering path is:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Analyze and characterize your critical path: number of resources, bytes, length.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Minimize number of critical resources: eliminate them, defer their download, mark them as async, and so on.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Optimize the number of critical bytes to reduce the download time (number of roundtrips).<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Optimize the order in which the remaining critical resources are loaded: download all critical assets as early as possible to shorten the critical path length.<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">Read more here: <\/span><a href=\"https:\/\/support.google.com\/partners\/answer\/7336280\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"font-weight: 400;\">https:\/\/support.google.com\/partners\/answer\/7336280<\/span><\/a><\/p>\n<p>&nbsp;<\/p>\n<p><em>Optimizing the critical rendering<\/em> path refers to prioritizing the display of content that relates to the current user action.<\/p>\n<p>Delivering a fast web experience requires a lot of work by the browser. Most of this work is hidden from us as web developers: we write the markup, and a nice looking page comes out on the screen. But how exactly does the browser go from consuming our HTML, CSS, and JavaScript to rendered pixels on the screen?<\/p>\n<p>Optimizing for performance is all about understanding what happens in these intermediate steps between receiving the HTML, CSS, and JavaScript bytes and the required processing to turn them into rendered pixels &#8211; that&#8217;s the <strong>critical rendering path<\/strong>.<\/p>\n<p>By optimizing the critical rendering path we can significantly improve the time to first render of our pages. Further, understanding the critical rendering path also serves as a foundation for building well-performing interactive applications. The interactive updates process is the same, just done in a continuous loop and ideally at 60 frames per second! But first, an overview of how the browser displays a simple page.<\/p>\n<p>&nbsp;<\/p>\n<p>https:\/\/www.youtube.com\/watch?v=-VB4iIJARCs<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; The first step to optimize the critical rendering path is to: &nbsp; minimize number of critical resources: eliminate them, defer their download, mark them as async, and so on analyze and characterize your critical path: number of resources, bytes, length optimize the order in which the remaining critical resources are loaded: download all critical [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","footnotes":""},"categories":[106],"tags":[],"class_list":{"0":"post-14710","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-google-mobile-sites","7":"entry"},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u25b7\u2764\ufe0fThe first step to optimize the critical rendering path is to: - Certification Answers<\/title>\n<meta name=\"description\" content=\"Get the answer of \u23e9The first step to optimize the critical rendering path is to: \u2705\u25b7\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u25b7\u2764\ufe0fThe first step to optimize the critical rendering path is to: - Certification Answers\" \/>\n<meta property=\"og:description\" content=\"Get the answer of \u23e9The first step to optimize the critical rendering path is to: \u2705\u25b7\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\" \/>\n<meta property=\"og:site_name\" content=\"Certification Answers\" \/>\n<meta property=\"article:published_time\" content=\"2017-11-21T13:00:47+00:00\" \/>\n<meta name=\"author\" content=\"CertificationAnswers\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"CertificationAnswers\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\"},\"author\":{\"name\":\"CertificationAnswers\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/0a9c7c94ef30c652c609d82ce40c0f22\"},\"headline\":\"The first step to optimize the critical rendering path is to:\",\"datePublished\":\"2017-11-21T13:00:47+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\"},\"wordCount\":373,\"articleSection\":[\"Google Mobile Sites Certification Assessment Answers\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\",\"url\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\",\"name\":\"\u25b7\u2764\ufe0fThe first step to optimize the critical rendering path is to: - Certification Answers\",\"isPartOf\":{\"@id\":\"https:\/\/www.certificationanswers.com\/en\/#website\"},\"datePublished\":\"2017-11-21T13:00:47+00:00\",\"author\":{\"@id\":\"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/0a9c7c94ef30c652c609d82ce40c0f22\"},\"description\":\"Get the answer of \u23e9The first step to optimize the critical rendering path is to: \u2705\u25b7\",\"breadcrumb\":{\"@id\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.certificationanswers.com\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Google Mobile Sites Certification Assessment Answers\",\"item\":\"https:\/\/www.certificationanswers.com\/en\/category\/google-mobile-sites\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"The first step to optimize the critical rendering path is to:\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/#website\",\"url\":\"https:\/\/www.certificationanswers.com\/en\/\",\"name\":\"Certification Answers\",\"description\":\"We help you to pass your exams\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.certificationanswers.com\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/0a9c7c94ef30c652c609d82ce40c0f22\",\"name\":\"CertificationAnswers\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/504682f79dcfd661f7d78a7b3ffbf7b900ae0b7897547f4e795ee7b622afe03a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/504682f79dcfd661f7d78a7b3ffbf7b900ae0b7897547f4e795ee7b622afe03a?s=96&d=mm&r=g\",\"caption\":\"CertificationAnswers\"},\"url\":\"https:\/\/www.certificationanswers.com\/en\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u25b7\u2764\ufe0fThe first step to optimize the critical rendering path is to: - Certification Answers","description":"Get the answer of \u23e9The first step to optimize the critical rendering path is to: \u2705\u25b7","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/","og_locale":"en_US","og_type":"article","og_title":"\u25b7\u2764\ufe0fThe first step to optimize the critical rendering path is to: - Certification Answers","og_description":"Get the answer of \u23e9The first step to optimize the critical rendering path is to: \u2705\u25b7","og_url":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/","og_site_name":"Certification Answers","article_published_time":"2017-11-21T13:00:47+00:00","author":"CertificationAnswers","twitter_card":"summary_large_image","twitter_misc":{"Written by":"CertificationAnswers","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/#article","isPartOf":{"@id":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/"},"author":{"name":"CertificationAnswers","@id":"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/0a9c7c94ef30c652c609d82ce40c0f22"},"headline":"The first step to optimize the critical rendering path is to:","datePublished":"2017-11-21T13:00:47+00:00","mainEntityOfPage":{"@id":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/"},"wordCount":373,"articleSection":["Google Mobile Sites Certification Assessment Answers"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/","url":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/","name":"\u25b7\u2764\ufe0fThe first step to optimize the critical rendering path is to: - Certification Answers","isPartOf":{"@id":"https:\/\/www.certificationanswers.com\/en\/#website"},"datePublished":"2017-11-21T13:00:47+00:00","author":{"@id":"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/0a9c7c94ef30c652c609d82ce40c0f22"},"description":"Get the answer of \u23e9The first step to optimize the critical rendering path is to: \u2705\u25b7","breadcrumb":{"@id":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.certificationanswers.com\/en\/the-first-step-to-optimize-the-critical-rendering-path-is-to\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.certificationanswers.com\/en\/"},{"@type":"ListItem","position":2,"name":"Google Mobile Sites Certification Assessment Answers","item":"https:\/\/www.certificationanswers.com\/en\/category\/google-mobile-sites\/"},{"@type":"ListItem","position":3,"name":"The first step to optimize the critical rendering path is to:"}]},{"@type":"WebSite","@id":"https:\/\/www.certificationanswers.com\/en\/#website","url":"https:\/\/www.certificationanswers.com\/en\/","name":"Certification Answers","description":"We help you to pass your exams","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.certificationanswers.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/0a9c7c94ef30c652c609d82ce40c0f22","name":"CertificationAnswers","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.certificationanswers.com\/en\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/504682f79dcfd661f7d78a7b3ffbf7b900ae0b7897547f4e795ee7b622afe03a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/504682f79dcfd661f7d78a7b3ffbf7b900ae0b7897547f4e795ee7b622afe03a?s=96&d=mm&r=g","caption":"CertificationAnswers"},"url":"https:\/\/www.certificationanswers.com\/en\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/posts\/14710","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/comments?post=14710"}],"version-history":[{"count":0,"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/posts\/14710\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/media?parent=14710"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/categories?post=14710"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.certificationanswers.com\/en\/wp-json\/wp\/v2\/tags?post=14710"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}