Loading...
 
Skip to main content

Improve page load times by not loading unused CSS and Javascript (e.g., elfinder.js, code_mirror.js, etc.)

Status
Open
Subject
Improve page load times by not loading unused CSS and Javascript (e.g., elfinder.js, code_mirror.js, etc.)
Version
25.x
26.x
master
Category
  • Usability
  • Feature request
Feature
Performance / Speed / Load / Compression / Cache
Theme: Look & feel, Styles, CSS, Theme Control Center
Resolution status
New
Submitted by
Aris Bernotas
Keep informed
jeff
Lastmod by
Aris Bernotas
Rating
(0)
Related-to
Description

More info from bootstrap:

1. Unused CSS

...
While we don’t have a prebuilt example for using PurgeCSS with Bootstrap, there are some helpful articles and walkthroughs that the community has written. Here are some options:

https://medium.com/dwarves-foundation/remove-unused-css-styles-from-bootstrap-using-purgecss-88395a2c5772
https://lukelowrey.com/automatically-removeunused-css-from-bootstrap-or-other-frameworks/

Lastly, this CSS Tricks article on unused CSS shows how to use PurgeCSS and other similar tools.
...

2. Non-blocking files


While minifying and using compression might seem like enough, making your files non-blocking ones is also a big step in making your site well-optimized and fast enough.

If you are using a Lighthouse plugin in Google Chrome, you may have stumbled over FCP. The First Contentful Paint metric measures the time from when the page starts loading to when any part of the page’s content is rendered on the screen.

You can improve FCP by deferring non-critical JavaScript or CSS. What does that mean? Simply, JavaScript or stylesheets that don’t need to be present on the first paint of your page should be marked with async or defer attributes.

This ensures that the less important resources are loaded later and not blocking the first paint. On the other hand, critical resources can be included as inline scripts or styles.

If you want to learn more about this, there are already a lot of great articles about it:

https://web.dev/render-blocking-resources/
https://web.dev/defer-non-critical-css/

Importance
6
Easy to solve?
2
Priority
12
Demonstrate Bug on Tiki 19+
Please demonstrate your bug on show2.tiki.org
Demonstrate Bug (older Tiki versions)
Ticket ID
8377
Created
Tuesday 18 April, 2023 16:27:30 UTC
by Aris Bernotas
LastModif
Tuesday 18 April, 2023 22:26:30 UTC


Show PHP error messages