Questions tagged [render-blocking]

38 questions
10
votes
1 answer

Gatsby.js: Load Google Fonts for Typography themes without Render-Blocking

I'm using Gatsby.js and its Typography plugin with the Irving theme. This theme requires the Google Fonts "Exo" and "Yrsa", and adds an import to the section of the exported static html files:
8
votes
0 answers

How to isolate critical CSS when using Create React App

What is the best way to address render blocking CSS and only loading critical CSS with Create React App since there is no access to edit the webpack config file?
yam55
  • 1,541
  • 2
  • 11
  • 12
4
votes
2 answers

Speed optimization: Optimize render blocking scripts with async

On https://bm-translations.de (fully self coded, no cms etc.) I am trying to eliminate render blocking of . Defer isnt working as I have another script at the…
Krystian
  • 887
  • 5
  • 21
  • 52
3
votes
1 answer

Render blocking by jquery and bootstrap library

I have index.html file where I have Jquery library and bootstrap library for js being loaded in tag, they are reported as the reason for render blocking, where, jquery.min.js takes 932 ms and bootstrap.min.js takes 765 ms to load. Here, I…
OM The Eternity
  • 15,694
  • 44
  • 120
  • 182
3
votes
4 answers

Can I put my external css files at the end of the html page to prevent render blocking?

I have done google page speed test. In the report it suggests me to remove render blocking css resources in above the fold content. I came to know that I have 14 external CSS files which causes delay in loading my page. So can I put my CSS files at…
Intern
  • 51
  • 1
  • 4
2
votes
1 answer

Prevent page rendering when inserting CSS link tag in JS

I would like to allow my users to choose between a “light” theme (the default) and a “dark” theme, which is provided by the addition of another CSS file. Here’s the JavaScript code. As you can see, I tried to provide for additional themes in the…
Timwi
  • 65,159
  • 33
  • 165
  • 230
2
votes
1 answer

Google pagespeed says to use inline javascript

On my project (Preloaders.net) I have a lot of scripts as it's a web-application. There is no way to have "some" css and js. I merged everything in one file but Google Pagespeed still used to say to remove the "render blocking CSS and JS". So I just…
Timur Gafforov
  • 771
  • 3
  • 10
  • 28
2
votes
1 answer

Google PageSpeed - render blocking content

Ok... so I am running a little test to try and get 100/100 from Google PageSpeed. We have the following website - https://redwing.media I had one thing left to do and that was to take the CSS out of the head (as its render blocking content), allow…
Chris
  • 1,939
  • 1
  • 19
  • 38
1
vote
1 answer

How to find the Handle of a CSS file in wordpress?

I am trying to delay the loading of a css file which is blocking the other resources from loading first during the loading of the website page. I am supposed to add this code to the functions.php file: function delay_css_loading() { …
1
vote
0 answers

Move child theme style.css without plugin

I am optimizing performance of my WordPress website The style.css of my child theme is coming under render blocking resources I need to move it from header to footer Code inside Child theme's function.php is function softek_child_enqueue_styles() { …
1
vote
0 answers

Wordpress: How to remove duplicate CSS, JS and font files?

On my Wordpress website, I'm getting multiple duplicates of CSS, JS and even Google Fonts (I don't use Google fonts on the website any more). GTmetrix link: https://gtmetrix.com/reports/www.anantamassage.com/zmmG6cvO How do I eliminate these…
1
vote
0 answers

How to reduce render-blocking java scripts in a website

I have a Joomla website that I wish to make faster, following the indications given by GoogleSpeed Insight page: "Resources are blocking the first paint of your page. Consider delivering critical JS/CSS inline and deferring all non-critical…
1
vote
2 answers

Eliminate render-blocking CSS without using JavaScript - GoogleAMP

I have scenario in GoogleAMP Project, where I can not move CSS out of head tag. Or event can't create element with JavaScript. And add it to head later after page content loads. Is there another way so it may satisfy AMP restrictions as well as…
Mutafaf
  • 126
  • 3
  • 13
1
vote
0 answers

Eliminate Render Blocking Styleetsheet | Performance Improvement javascript | Single page application| angular 1.5x| Google Page Speed

Currently, I am looking for Performance Improvement in Angular 1.x version app. When I run the Google Page speed I received RENDER BLOCKING STYLESHEET to Optimize the application to get 100/100 Page score.I have found some of the interesting sites…
1
vote
1 answer

What will be the best way to load CSS async?

I have nine different CSS files. My website will not load until the browser downloads all the CSS files. Most of CSS is not even needed for the home page. In JavaScript you can do like