Jump to content
  • 1

Performance improvement - Render blocking and unused Java script help

Question

Hi team!

I am just exploring Chrome Devtools for the first time to improve site performance. A couple of main things that have popped up are 

- eliminate render blocking resources

- remove unused javascript/ CSS

I am a newbie and can't find anything online on how to actually do this. Can anyone help? Point me to a guide somewhere? Would really appreciate it :)

Thanks

Sandra

Link to comment

7 answers to this question

Recommended Posts

  • 0
On 6/27/2020 at 2:18 AM, SandraHCopywriting said:

I am a newbie and can't find anything online on how to

- eliminate render blocking resources

- remove unused javascript/ CSS

These are part of the Squarespace custom CMS platform and you cannot remove them.

Bear in mind that these tools are designed for developers who code their sites from scratch and have full control over their code and styles. When you use these tools to test Squarespace sites you'll see results that are not relevant to you.

Things worth considering when trying to increase site performance include:

  • Use Squarespace 7.1 in preference to 7.0. Squarespace 7.1 can appear¬†faster for visitors than Squarespace 7.0 and is¬†constantly being improved.
  • If you are planning to use Squarespace 7.0, use a¬†Brine-family¬†template. Brine-family¬†based sites have a feature called Ajax Loading which improves performance over other 7.0 templates that don't have this feature.
  • Keep image sizes low.¬†Ideally,¬†images should be less than 500KB in size, with a width of 1500px or 2500px.
  • Keep galleries small. Ideally, limit them to¬†50 images each.¬†
  • Keep Banner Slideshows¬†small (less than 10 images), especially on 7.0 Index pages and 7.1 pages with multiple sections.
  • Limit the number of Blocks on one page to 60.
  • Use JPEG (.jpg) images where possible (but PNGs for logos). Limit the number of GIFs.
  • Don't heavily compress JPEG images before adding them or their file size may increase after Squarespace¬†processes¬†them¬†
  • Avoid¬†embedding content where possible. Don't embed content or libraries unless they are essential.
  • Reduce the number of fonts. Fonts must all¬†load behind the scenes before the¬†page¬†can appear in the¬†browser.
  • Don't add custom code that you find on forums, without understanding how it works and how it will affect your site's performance. Typically if you find code that¬†includes a¬†'$' character then it relies¬†on a comparatively¬†large code library called jQuery and this could slow down your site unnecessarily.

-Paul

Edited by paul2009
edited for clarity

Improve your online store with our extensions.
About: Sqsp Circle Leader since 2017. I value honesty, transparency, appreciation and great design ‚ô•.
Work: Squarespace Expert and founder of¬†SF Digital, dedicated to improving websites by building the features¬†Squarespace didn't include‚ĄĘ.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Link to comment
  • 1
On 7/25/2020 at 4:11 AM, paul2009 said:

These are part of the Squarespace's custom CMS platform and you cannot remove them.

Bear in mind that these tools are designed for developers who code their sites from scratch and have full control over their code and styles. When you use these tools to test Squarespace sites you'll see results that are not relevant to you.

Things worth considering when trying to increase site performance include:

  • Squarespace 7.1 can appear¬†faster for visitors than Squarespace 7.0 (although it is currently slower on the back-end where you configure it)
  • Squarespace 7.0 Brine-family sites have a feature called Ajax Loading which improves performance over 7.0 templates without this feature.
  • Keep image sizes low.¬†Ideally,¬†images should be less than 500KB in size, with a width of 1500px or 2500px.
  • Keep galleries small. Ideally, limit them to¬†50 images each.¬†
  • Keep Banner Slideshows¬†small (less than 10 images), especially on Index pages.
  • Use JPEG (.jpg) images where possible (but PNGs for logos). Limit the number of GIFs.
  • Avoid¬†embedding content where possible. Don't embed content or libraries unless they are essential.
  • Reduce the number of fonts. Fonts must all¬†load behind the scenes before the¬†page¬†can appear in the¬†browser.

-Paul

So basically what are you saying is switch platforms if you want a website that performs better. ūüôā

Link to comment
  • 0
On 7/25/2020 at 12:11 PM, paul2009 said:

These are part of the Squarespace's custom CMS platform and you cannot remove them.

Bear in mind that these tools are designed for developers who code their sites from scratch and have full control over their code and styles. When you use these tools to test Squarespace sites you'll see results that are not relevant to you.

Things worth considering when trying to increase site performance include:

  • Squarespace 7.1 can appear¬†faster for visitors than Squarespace 7.0 (although it is currently slower on the back-end where you configure it)
  • Squarespace 7.0 Brine-family sites have a feature called Ajax Loading which improves performance over 7.0 templates without this feature.
  • Keep image sizes low.¬†Ideally,¬†images should be less than 500KB in size, with a width of 1500px or 2500px.
  • Keep galleries small. Ideally, limit them to¬†50 images each.¬†
  • Keep Banner Slideshows¬†small (less than 10 images), especially on Index pages.
  • Use JPEG (.jpg) images where possible (but PNGs for logos). Limit the number of GIFs.
  • Avoid¬†embedding content where possible. Don't embed content or libraries unless they are essential.
  • Reduce the number of fonts. Fonts must all¬†load behind the scenes before the¬†page¬†can appear in the¬†browser.

-Paul

Dear Paul, I have similar performance problems with my page. I'm using analysing platforms such as Sistrix or PageSpeedInsights, and they all say the same: Reduce unused JavaScripr or try to bundle the Script applications. I'm a bit fed up when Squarespace is saying there can't be done anything. We're paying money for the service!

Link to comment
  • 0
On 7/25/2020 at 3:11 AM, paul2009 said:

These are part of the Squarespace's custom CMS platform and you cannot remove them.

Bear in mind that these tools are designed for developers who code their sites from scratch and have full control over their code and styles. When you use these tools to test Squarespace sites you'll see results that are not relevant to you.

Things worth considering when trying to increase site performance include:

  • Squarespace 7.1 can appear¬†faster for visitors than Squarespace 7.0 (although it is currently slower on the back-end where you configure it)
  • Squarespace 7.0 Brine-family sites have a feature called Ajax Loading which improves performance over 7.0 templates without this feature.
  • Keep image sizes low.¬†Ideally,¬†images should be less than 500KB in size, with a width of 1500px or 2500px.
  • Keep galleries small. Ideally, limit them to¬†50 images each.¬†
  • Keep Banner Slideshows¬†small (less than 10 images), especially on Index pages.
  • Use JPEG (.jpg) images where possible (but PNGs for logos). Limit the number of GIFs.
  • Avoid¬†embedding content where possible. Don't embed content or libraries unless they are essential.
  • Reduce the number of fonts. Fonts must all¬†load behind the scenes before the¬†page¬†can appear in the¬†browser.

-Paul

Okay, but I am still getting a "poor" rating from Page Speed Insights on pages without any pictures, background images, or gifs, with only a few text boxes, all with the same font. My logo is around 100KB. And it says JavaScript and render-blocking are almost solely responsible for my slow speed.

Is it possible to contact Squarespace and ask them to fix this? Or at the very least does Google not punish Squarespace sites for loading a couple seconds longer? 

I'm not too worried about the customers who already want to buy from me (I do art commissions), but I am worried that my SEOs will go down the tank because Google recently started getting stricter with load times and what sites are prioritized.

Link to comment
  • 0
2 hours ago, FinnRedwoodArt said:

Okay, but I am still getting a "poor" rating from Page Speed Insights...And it says JavaScript and render-blocking are almost solely responsible for my slow speed. Is it possible to contact Squarespace and ask them to fix this?

This topic can be confusing, so let me try to clarify.

I'm not saying that Squarespace performance cannot be improved. It can always be improved. In reply to the original question, I'm simply explaining that there is nothing that you or I - or any third party specialist - can do to reduce "unused" or render-blocking JavaScript on Squarespace.

Only Squarespace's Web Performance team can improve the backend code, and they've already made significant progress in taking steps to ensure Squarespace sites compete well. Where possible, they have removed render-blocking Javascript and are lazy-loading images across websites. It's worth bearing in mind that not all of the improvements will benefit 7.0 sites, so 7.1 is likely to show better CWVs over time in comparison.

Improve your online store with our extensions.
About: Sqsp Circle Leader since 2017. I value honesty, transparency, appreciation and great design ‚ô•.
Work: Squarespace Expert and founder of¬†SF Digital, dedicated to improving websites by building the features¬†Squarespace didn't include‚ĄĘ.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Link to comment
  • 0

Hi there,

I have similar performance problems, I downsized my images etc. I got poor ratings on performance and sadly the pages are not appearing smoothly on my mobile. A big disappointment. I have only five pages, no animations. How is this possible, is my only help to switch platform?

Link to comment
  • 0

I wouldn't say the topic is that confusing, there is a lot that could be done on squarespace side, and they should do more as you are paying for SAAS. Its just as a consumer of their product your hands are tied, and your options are accept it or change platform.

For the record our site also loads extremely slowly, into the minutes for pages to render on a slow connection. As mentioned you can reduce image size and quality, but that's about it. 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

√ó
√ó
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.