Resources are blocking the first paint of your page. Consider delivering critical JS/CSS inline and deferring all non-critical JS/styles
css/bootsrtap.min.css
css/main.css
I am getting this message while checking my website loading speed on GTmetrix, PageSpeed Insights. It is slowing my website down. How can I solve this issue? Please help, Thank you.
Deliver critical CSS by extracting the class definitions and put those classes inside a <style> block at the head of the page:
e.g.
<style type="text/css">
.accordion-btn {background-color: #ADD8E6;color: #444;cursor: pointer;padding: 18px;width: 100%;border: none;text-align: left;outline: none;font-size: 15px;transition: 0.4s;}.container {padding: 0 18px;display: none;background-color: white;overflow: hidden;}
</style>
Deferring all non-critical CSS.
e.g.
<link rel="preload" href="styles.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="styles.css"></noscript>
For more details, refer to this guide: https://web.dev/defer-non-critical-css/