{"id":1841,"date":"2021-08-05T11:39:54","date_gmt":"2021-08-05T11:39:54","guid":{"rendered":"https:\/\/www.wpstaq.com\/?post_type=pagespeedinsights&amp;p=1841"},"modified":"2021-08-05T11:39:54","modified_gmt":"2021-08-05T11:39:54","slug":"reduce-javascript-execution-time","status":"publish","type":"pagespeedinsights","link":"https:\/\/www.wpstaq.com\/sg\/pagespeedinsights\/reduce-javascript-execution-time\/","title":{"rendered":"Reduce JavaScript execution time"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\" id=\"overview\">Overview<\/h2>\n\n\n\n<p>Reducing JavaScript execution time, in general, refers to decreasing the amount of time spent&nbsp;<em>parsing<\/em>,&nbsp;<em>compiling<\/em>, and&nbsp;<em>executing<\/em>&nbsp;JavaScript files.<\/p>\n\n\n\n<p>By default, JavaScript executes on the&nbsp;<a href=\"https:\/\/gtmetrix.com\/minimize-main-thread-work.html#what-is\">main-thread<\/a>&nbsp;and when this is happening, the browser cannot execute other tasks.<\/p>\n\n\n\n<p>Depending on the order in which the scripts are executed, this could prevent elements from being painted, delaying page rendering and affecting page interactivity.<\/p>\n\n\n\n<p>Reducing JavaScript execution time essentially reduces the main-thread blocking time &#8211; in turn, potentially weakening the effect of cascaded requests.<\/p>\n\n\n\n<p>Improving this audit can result in better Performance metrics, and drive real-world performance gains.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"how-to-reduce-javascript-execution-time-with-staq\">How to reduce JavaScript execution time with Staq<\/h2>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>AGGRESIVE OPTIMIZATION<\/strong><\/p>\n\n\n\n<p>**TRY WITH CAUTION**<\/p>\n\n\n\n<p>This strategy does not work for all websites, however, it is a quick and easy solution to apply and may work for you.<\/p>\n\n\n\n<p>Under&nbsp;<strong>Delay JavaScript execution,&nbsp;<\/strong>go to&nbsp;<strong>Exclude JavaScript keywords from delay<\/strong>&nbsp;and delete all excluded file names. This will make this list empty:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/remove-excluded-js-file-names.png\" alt=\"\" class=\"wp-image-3161\"\/><\/figure>\n\n\n\n<p>Then, go to the website in&nbsp;<strong>Incognito mode<\/strong>&nbsp;and make sure:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>the Inspect window is open<\/li><li>it is selected on the&nbsp;<strong>Network<\/strong>&nbsp;tab<\/li><li>the JS tab is selected.<\/li><\/ul>\n\n\n\n<p>Then, go ahead and&nbsp;<strong>refresh<\/strong>&nbsp;your screen with your keyboard.<\/p>\n\n\n\n<p>Under the JS tab, you should notice that no scripts will load&nbsp;<strong>until you move your mouse or keyboard<\/strong>&nbsp;as per the screenshot below:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/js-files-loading.gif\" alt=\"\" class=\"wp-image-3172\"\/><\/figure><\/div>\n\n\n\n<p>After, go ahead to the testing phase to ensure the site works perfectly. If so, you&#8217;re done. If it requires tweaks, refer to the tutorial below.<\/p>\n\n\n\n<p><strong>QUICK TIP: It is recommended that you turn off animation to all elements that appear above the fold only.&nbsp;The animation is powered by JavaScript which will give you a blank section until you move your mouse.<\/strong><br><br><br><br><br><br><strong>MODERATE OPTIMIZATION<\/strong><\/p>\n\n\n\n<p>To see the unminified JS files, go to&nbsp;<strong>Site Optimizer&nbsp;<\/strong>&gt;&nbsp;<strong>JavaScript<\/strong>&nbsp;and turn off both:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Minify JavaScript tags<\/li><li>Minify JavaScript files<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/Screen-Shot-2022-01-25-at-3.30.44-pm.png\" alt=\"\"\/><\/figure>\n\n\n\n<p>Continue to have&nbsp;<strong>Delay JavaScript execution<\/strong>&nbsp;enabled with the default list of keywords listed under&nbsp;<strong>Exclude JavaScript keywords from delay<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/Screen-Shot-2022-01-25-at-3.32.14-pm.png\" alt=\"\"\/><\/figure>\n\n\n\n<p>Then, in&nbsp;<strong>Incognito&nbsp;<\/strong>mode in Chrome, open&nbsp;<strong>Inspect<\/strong>&nbsp;and go to&nbsp;<strong>Network<\/strong>&nbsp;&gt;&nbsp;<strong>JS<\/strong>. Refresh the page with your keyboard (without moving the mouse over the page) and review all javascript files that have loaded. These files have been excluded.<\/p>\n\n\n\n<p>To determine if that particular JS file is required at the initial load, right-click that file and click&nbsp;<strong>Block request URL<\/strong>&nbsp;as per the GIF below:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/block-resource.gif\" alt=\"\" class=\"wp-image-3176\"\/><\/figure><\/div>\n\n\n\n<p>Refresh the page in&nbsp;<strong>Incognito<\/strong>&nbsp;mode and see if anything on the website breaks. If it doesn&#8217;t, then it is safe to say that this particular JS file can be delayed upon initial load.<\/p>\n\n\n\n<p>Repeat the process.<\/p>\n\n\n\n<p>If a file breaks the look and feel of the website, unblock the file and move to the next one.<\/p>\n\n\n\n<p>Once you&#8217;re done, you should have a list of blocked JS files in red like this:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/blocked-js-resources-1024x465.png\" alt=\"\" class=\"wp-image-3177\"\/><\/figure><\/div>\n\n\n\n<p>Right-click on each file and copy the URL:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/copy-link-address-1024x475.png\" alt=\"\" class=\"wp-image-3178\"\/><\/figure><\/div>\n\n\n\n<p>Then, in the backend of WordPress, go to the JavaScript optimization section in Staq Hosting paste the URL and remove the unnecessary information as per the GIF below:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/include-js-keywords-delay.gif\" alt=\"\" class=\"wp-image-3179\"\/><\/figure><\/div>\n\n\n\n<p><strong>Note, once you&#8217;re done, go ahead and unblock the blocked file from your browser by right-clicking it<\/strong>.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>Finally, you should <strong>delay third party code <\/strong>if not required on initial load.<br><br>Using the above techniques and solutions should greatly improve JavaScript execution time.<\/p>\n","protected":false},"template":"","class_list":["post-1841","pagespeedinsights","type-pagespeedinsights","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Reduce JavaScript execution time - How to fix really quickly with Staq<\/title>\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.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Reduce JavaScript execution time - How to fix really quickly with Staq\" \/>\n<meta property=\"og:description\" content=\"Overview Reducing JavaScript execution time, in general, refers to decreasing the amount of time spent&nbsp;parsing,&nbsp;compiling, and&nbsp;executing&nbsp;JavaScript files. By default, JavaScript executes on the&nbsp;main-thread&nbsp;and when this is happening, the browser cannot execute other tasks. Depending on the order in which the scripts are executed, this could prevent elements from being painted, delaying page rendering and affecting&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/\" \/>\n<meta property=\"og:site_name\" content=\"Managed Hosting Platform for WordPress\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/staqhosting\/\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/remove-excluded-js-file-names.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/\",\"url\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/\",\"name\":\"Reduce JavaScript execution time - How to fix really quickly with Staq\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.wpstaq.com\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/remove-excluded-js-file-names.png\",\"datePublished\":\"2021-08-05T11:39:54+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/#breadcrumb\"},\"inLanguage\":\"en-sg\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-sg\",\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.wpstaq.com\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/remove-excluded-js-file-names.png\",\"contentUrl\":\"https:\\\/\\\/www.wpstaq.com\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/remove-excluded-js-file-names.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/reduce-javascript-execution-time\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.wpstaq.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"PageSpeedInsights\",\"item\":\"https:\\\/\\\/www.wpstaq.com\\\/pagespeedinsights\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Reduce JavaScript execution time\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/#website\",\"url\":\"https:\\\/\\\/www.wpstaq.com\\\/\",\"name\":\"Managed Hosting Platform for WordPress\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.wpstaq.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-sg\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/#organization\",\"name\":\"Staq\",\"alternateName\":\"WPStaq\",\"url\":\"https:\\\/\\\/www.wpstaq.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-sg\",\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.wpstaq.com\\\/wp-content\\\/uploads\\\/2023\\\/05\\\/cropped-LogoNoText.png\",\"contentUrl\":\"https:\\\/\\\/www.wpstaq.com\\\/wp-content\\\/uploads\\\/2023\\\/05\\\/cropped-LogoNoText.png\",\"width\":512,\"height\":512,\"caption\":\"Staq\"},\"image\":{\"@id\":\"https:\\\/\\\/www.wpstaq.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/staqhosting\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/wpstaq\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Reduce JavaScript execution time - How to fix really quickly with Staq","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.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/","og_locale":"en_US","og_type":"article","og_title":"Reduce JavaScript execution time - How to fix really quickly with Staq","og_description":"Overview Reducing JavaScript execution time, in general, refers to decreasing the amount of time spent&nbsp;parsing,&nbsp;compiling, and&nbsp;executing&nbsp;JavaScript files. By default, JavaScript executes on the&nbsp;main-thread&nbsp;and when this is happening, the browser cannot execute other tasks. Depending on the order in which the scripts are executed, this could prevent elements from being painted, delaying page rendering and affecting&hellip;","og_url":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/","og_site_name":"Managed Hosting Platform for WordPress","article_publisher":"https:\/\/www.facebook.com\/staqhosting\/","og_image":[{"url":"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/remove-excluded-js-file-names.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/","url":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/","name":"Reduce JavaScript execution time - How to fix really quickly with Staq","isPartOf":{"@id":"https:\/\/www.wpstaq.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/#primaryimage"},"image":{"@id":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/#primaryimage"},"thumbnailUrl":"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/remove-excluded-js-file-names.png","datePublished":"2021-08-05T11:39:54+00:00","breadcrumb":{"@id":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/#breadcrumb"},"inLanguage":"en-sg","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/"]}]},{"@type":"ImageObject","inLanguage":"en-sg","@id":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/#primaryimage","url":"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/remove-excluded-js-file-names.png","contentUrl":"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2022\/01\/remove-excluded-js-file-names.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.wpstaq.com\/pagespeedinsights\/reduce-javascript-execution-time\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.wpstaq.com\/"},{"@type":"ListItem","position":2,"name":"PageSpeedInsights","item":"https:\/\/www.wpstaq.com\/pagespeedinsights\/"},{"@type":"ListItem","position":3,"name":"Reduce JavaScript execution time"}]},{"@type":"WebSite","@id":"https:\/\/www.wpstaq.com\/#website","url":"https:\/\/www.wpstaq.com\/","name":"Managed Hosting Platform for WordPress","description":"","publisher":{"@id":"https:\/\/www.wpstaq.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.wpstaq.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-sg"},{"@type":"Organization","@id":"https:\/\/www.wpstaq.com\/#organization","name":"Staq","alternateName":"WPStaq","url":"https:\/\/www.wpstaq.com\/","logo":{"@type":"ImageObject","inLanguage":"en-sg","@id":"https:\/\/www.wpstaq.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2023\/05\/cropped-LogoNoText.png","contentUrl":"https:\/\/www.wpstaq.com\/wp-content\/uploads\/2023\/05\/cropped-LogoNoText.png","width":512,"height":512,"caption":"Staq"},"image":{"@id":"https:\/\/www.wpstaq.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/staqhosting\/","https:\/\/www.linkedin.com\/company\/wpstaq"]}]}},"_links":{"self":[{"href":"https:\/\/www.wpstaq.com\/sg\/wp-json\/wp\/v2\/pagespeedinsights\/1841","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wpstaq.com\/sg\/wp-json\/wp\/v2\/pagespeedinsights"}],"about":[{"href":"https:\/\/www.wpstaq.com\/sg\/wp-json\/wp\/v2\/types\/pagespeedinsights"}],"wp:attachment":[{"href":"https:\/\/www.wpstaq.com\/sg\/wp-json\/wp\/v2\/media?parent=1841"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}