Removing JavaScript and Render-Blocking Sources

Removing JavaScript and Render-Blocking Sources

Jimenez559
Visitor
3 0 2

Can someone please give me step-by-step directions to remove unused java-script and render-blocking sources.

Replies 5 (5)

oscprofessional
Shopify Partner
16266 2431 3160

@Jimenez559 ,

 

Can you share the store URL so that I can check the unused js files? You cannot remove the 3rd party app CSS and js. 

The Opportunities section of your Lighthouse report lists all URLs blocking the first paint of your page. The goal is to reduce the impact of these render-blocking URLs by inlining critical resources, deferring non-critical resources, and removing anything unused.

 

-Resources are blocking the first paint of your page. Consider delivering critical JS/CSS inline and deferring all non-critical JS/styles.

 

  • Deferring all non-critical JS/CSS
  • Moving Third-party App stylesheet to the footer.
  • Minify the third-party app CSS/JS file.

 

Once you've identified critical code, move that code from the render-blocking URL to an inline script tag in your HTML page. When the page loads, it will have what it needs to handle the page's core functionality.

 

If there's code in a render-blocking URL that's not critical, you can keep it in the URL, and then mark the URL with async or defer attributes.

 

 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free | OSCP Shipping Discounts App : Free
Jimenez559
Visitor
3 0 2

Yea I have no clue about coding. @oscprofessional  My store url is www.amoursembrace.com .

oscprofessional
Shopify Partner
16266 2431 3160

@Jimenez559 ,

You can not remove the Unused Javascript. 

You have to use defer Async method for render-blocking sources.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free | OSCP Shipping Discounts App : Free

flareAI
Shopify Partner
2405 224 547

Hello @Jimenez559,


This is Gina from flareAI app.


Here is a step-by-step process to remove unused JavaScript and render-blocking sources from your Shopify store:


1. Identify unused Javascript: Use tools like Google Chrome's DevTools or GTmetrix to identify the JavaScript files that are not being used on your website.
2. Remove the unused Javascript: Remove the identified JavaScript files from your theme's code. You can either delete the code or comment it out.
3. Minimize the remaining Javascript: Minimize the remaining JavaScript files to reduce their size and improve the loading speed of your website. 
4. Combine multiple JavaScript files: If you have multiple JavaScript files, combine them into a single file to reduce the number of HTTP requests. This will improve the loading speed of your website.
5. Test your changes: Test your website after making the changes to ensure that everything is working as expected. Use tools like GTmetrix or Google PageSpeed Insights to check the loading speed of your website.


Also take a look at this reference link:


Render-Blocking JavaScript


Gina

flareAI : Get Sales from Google Search, on Autopilot
$10+ billion in eCommerce on Google Search, every day. Find out how much you are missing

xmax11
New Member
4 0 0

you can not remove unused javascript and if your website is wordpress use Wp-rocket to defer or async unused javascript to optimize your speed. if its not helpful visit

https://modsfreak.com/