CMS Development

FurqanAli
Participant

Hubspot Website optimization

Hi there,

Hope you all are doing great. I'm optimizing a website and checking the result based on google insight specifically for mobile since the desktop version has 90+ performance. I see multiple bundles under unused javascript and also some duplicate modules in the javascript bundle. Any possibility to remove the unused js and duplicate bundles since they are blocking the rendering and affecting the website performance on mobile.

Thanks a lot.

0 Upvotes
7 Replies 7
FurqanAli
Participant

Hubspot Website optimization

@ChehakWadhdwa thanks for answering my query. Are you asking to add each module's CSS and javascript into it's HTML and hubl portion rather than the module.css and js?

0 Upvotes
ChehakWadhdwa
Member | Diamond Partner
Member | Diamond Partner

Hubspot Website optimization

Hi @FurqanAli ,  Yes, you have to do the same along with removing commented css and js under /* ............*/ and also make sure there will be no unnecessary extra spacing inside your module.

Hope this helps!

If we were able to answer your query, kindly help the community by marking it as a solution.
Thanks and Regards.

0 Upvotes
FurqanAli
Participant

Hubspot Website optimization

thanks for clarifying also Do we need to remove space from the markup html+hubl(minify) other than the CSS and javascript?

0 Upvotes
ChehakWadhdwa
Member | Diamond Partner
Member | Diamond Partner

Hubspot Website optimization

 yes @FurqanAli ,

if you are doing so then it will be plus point for you, as how much is possible keep your code clean and minify as browser has to read no of lines of code inorder to execute, so it will be more beneficial if you remove extra white spacing.

 

Hope this helps!

If we were able to answer your query, kindly help the community by marking it as a solution.
Thanks and Regards.

0 Upvotes
FurqanAli
Participant

Hubspot Website optimization

thanks a lot, @ChehakWadhdwa also do you recommend using the async/defer keyword in the script tag for the module?

0 Upvotes
ChehakWadhdwa
Member | Diamond Partner
Member | Diamond Partner

Hubspot Website optimization

Hi @FurqanAli ,

Copy your all css and js from respective main.css and main.js  and paste it into your (HTML+HUBL) as shown in below images, it will render only when required

 

{% require_css %}

<style>

//your required css

</style>

{% end_require_css %}

 

{% require_js %}

 <script>

//your required js

 </script>

{% end_require_js %}

 

ChehakWadhdwa_0-1650011134143.png

 

Hope this helps!

If we were able to answer your query, kindly help the community by marking it as a solution.
Thanks and Regards.

0 Upvotes
FurqanAli
Participant

Hubspot Website optimization

@ChehakWadhdwa Although I have now used these 2 functions for my styles and scripts in modules, the reduce unused javascript and remove duplicate bundles issue is still there.

0 Upvotes