{"id":6464,"date":"2021-10-28T19:40:31","date_gmt":"2021-10-28T19:40:31","guid":{"rendered":"https:\/\/www.s-sols.com\/?post_type=doc&#038;p=6464"},"modified":"2023-12-28T19:20:56","modified_gmt":"2023-12-28T19:20:56","slug":"scripts-optimization-accel","status":"publish","type":"doc","link":"https:\/\/www.s-sols.com\/docs\/wordpress\/accelerator\/how-does-it-work-accel\/scripts-optimization-accel","title":{"rendered":"Splitting script loading into 4 steps Accelerator for WordPress"},"content":{"rendered":"<p style=\"text-align:justify\">\n  The fewer scripts at each stage of loading, the <strong>higher<\/strong> its <strong>speed<\/strong>.<span style=\"font-size:12pt\"> <\/span>Scripts are the hardest part of pages to optimize for. There are scripts that depend on their location (for example, advertising from<span style=\"font-size:12pt\"> <\/span>Google AdWords). Therefore, the default optimization makes minimal changes. Many other optimizing plugins can &#8220;break&#8221; the scripts.\n<\/p>\n<h2>\n  4 groups<br \/>\n<\/h2>\n<p style=\"text-align:justify\">\n  The most efficient way to optimize scripts is to delay their loading. But scripts are needed to display the page correctly. Therefore, they are divided into 4 groups:\n<\/p>\n<ul>\n<li>\n<div style=\"text-align:justify\"><strong>Critical<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      This includes everything that <a href=\".\/settings-scripts-accel#general\">needs to be loaded before<\/a> the main content of the page. This is usually empty. Scripts may be included here, which for some reason should remain unchanged and be loaded strictly in the place where they were originally located.\n    <\/p>\n<\/li>\n<li>\n<div style=\"text-align:justify\"><strong>Critical special<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      This includes everything that <a href=\".\/settings-scripts-accel#general\">needs to be loaded after<\/a> the main content of the page. This is usually empty. Scripts may be included here, which responsible for the primary display of page content (for example, for displaying individual elements) can be included here.\n    <\/p>\n<\/li>\n<li>\n<div style=\"text-align:justify\"><strong>Non-critical<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      Everything that can be <a href=\".\/settings-scripts-accel#non_critical\">loaded after<\/a> the main content of the page with a delay. Usually, all the main scripts of the site are here.\n    <\/p>\n<\/li>\n<li>\n<div style=\"text-align:justify\"><strong>Special<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      Anything that <a href=\".\/settings-scripts-accel#special\">can be loaded even later<\/a> and does not affect the main rendering of the page. This includes, for example, scripts for tracking, advertising, social networks, etc.\n    <\/p>\n<\/li>\n<\/ul>\n<h2>\n  Script optimization (JS)<br \/>\n<\/h2>\n<ul start=\"5\">\n<li>\n<div style=\"text-align:justify\"><strong>Delayed loading<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      Highly strongly influences on indicators <a href=\"https:\/\/web.dev\/lighthouse-total-blocking-time\" rel=\"nofollow noopener\" target=\"_blank\">Total Blocking Time (TBT)<\/a> and <a href=\"https:\/\/web.dev\/interactive\/\" rel=\"nofollow noopener\" target=\"_blank\">Time to Interactive (TTI)<\/a>.<span style=\"font-size:12pt\"> <\/span>The loss can reach 30 points (in direct proportion to the volume of scripts).\n    <\/p>\n<p style=\"text-align:center\">\n      <img decoding=\"async\" src=\"\/data\/content\/doc\/wordpress\/accelerator\/scripts-optimization-accel\/js-split-scheme-en.png\" alt=\"js-split-scheme\" title=\"js-split-scheme - Splitting script loading into 4 steps\" \/>\n    <\/p>\n<p style=\"text-align:justify\">\n      By default, the non-critical and special group\u2019s load <a href=\".\/settings-scripts-accel#general\">latency times<\/a> are set for the greatest compatibility and the best performance. For specific sites, these values can be empirically reduced.\n    <\/p>\n<\/li>\n<li>\n<div style=\"text-align:justify\"><strong>Grouping<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      By analogy with <a href=\".\/styles-optimization-accel\">styles (CSS)<\/a>, it reduces the number of requests to the server, thereby reducing the page load time. But from experience, due to scripts being generally loaded on hold, then this does not give a tangible increase in the rating and the likelihood of disrupting their work increases. <a href=\"https:\/\/gtmetrix.com\" rel=\"nofollow noopener\" target=\"_blank\">GTMetrix<\/a> shows the number of requests, and by enabling this mode, you can try to increase the score on it.\n    <\/p>\n<\/li>\n<li>\n<div style=\"text-align:justify\"><strong>Minification<\/strong>\n    <\/div>\n<p style=\"text-align:justify\">\n      Reducing the size of scripts by removing extra spaces and line breaks.\n    <\/p>\n<\/li>\n<\/ul>\n<p style=\"text-align:justify\">\n  The solution has been tested with the most <a href=\".\/getting-started-accel#compatibility\">popular plugins<\/a>, does not &#8220;break&#8221; advertising scripts, analytics scripts, and video frames. According to statistics, about <a href=\".\/statistics-accel#fine_tuning\">20% of sites<\/a> require additional configuration, most of which, of course, are related to scripts.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The fewer scripts at each stage of loading, the higher its speed. Scripts are the hardest part of pages to optimize for. There are scripts that depend on their location (for example, advertising from Google AdWords). Therefore, the default optimization makes minimal changes. Many other optimizing plugins can &#8220;break&#8221; the scripts. 4 groups The most&#8230;<\/p>\n","protected":false},"author":18,"featured_media":0,"parent":6456,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"rank_math_lock_modified_date":false},"categories":[816],"tags":[163,870,871,165,818,869,154,689,872,692,92],"class_list":["post-6464","doc","type-doc","status-publish","hentry","category-accelerator","tag-cache","tag-css","tag-javascript","tag-minify","tag-optimize","tag-pagespeed","tag-performance","tag-plugin","tag-site","tag-speed","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/doc\/6464","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/doc"}],"about":[{"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/types\/doc"}],"author":[{"embeddable":true,"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/comments?post=6464"}],"up":[{"embeddable":true,"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/doc\/6456"}],"wp:attachment":[{"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/media?parent=6464"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/categories?post=6464"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.s-sols.com\/api\/wp\/v2\/tags?post=6464"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}