CSS and JavaScript Optimization in Osclass: Merge, Minify, Control

Quick overview

Configure built-in CSS and JS optimization safely, including exclusions and checks to prevent frontend regressions.

What this article covers

• Compress and minify osclass scripts and stylesheets
• Enable optimization in osclass
• CSS Optimization
• JS Optimization

Practical notes

• Validate changes in staging before production updates.
• Track user impact with analytics, logs, and search performance signals.

Compress and minify osclass scripts and stylesheets

Optimization of scripts and stylesheets is very important for SEO, user experience and website speed. Brand new optimization features in osclass contains following features:

• merge CSS/JS files into one
• minify merged files (remove white spaces & comments)
• exclude some scripts based on keyword in script URL
• exclude merge & optimization on particular pages

Note that external libraries are not merged, as it usually cause conflicts. You should also exclude font / icon font libraries to avoid problems.

Enable optimization in osclass

To enable osclass optimize your CSS stylesheets and JS scripts, go to Oc-admin > Settings > Optimization:

You can now enable optimization. First, there are CSS settings, then JS settings. Both has identical settings.

CSS Optimization

Enable "Merge internal CSS style sheets into one" to merge all internal CSS files into 1 big one. Note that sheets those are not on your URL are not included.

Enable "Minify/optimize merged CSS style sheet" to remove all white spaces, comments and redundant code to reduce size of master file.

Into field "CSS Exclude words" enter keywords of libraries those should be excluded, by default it should be "font" and "awesome" to exclude font libraries as well as font awesome.

Into field "CSS Exclude pages" enter pages where optimization should not be performed (i.e. home, search, item, ...) in case you experience issues on particular pages with optimized file

JS Optimization

Enable "Merge internal JS scripts into one" to merge all internal JS script files into 1 big one. Note that sheets those are not on your URL are not included. Keep in mind that merged file is placed on website as first, excluded and external scripts are placed after master file.

Enable "Minify/optimize merged JS script" to remove all white spaces, comments and redundant code to reduce size of master file.

Into field "JS Exclude words" enter keywords of libraries those should be excluded, by default it should be "tiny" to exclude tinyMCE those contains relative links to sub-libraries and would lead to JS error.

Into field "JS Exclude pages" enter pages where optimization should not be performed (i.e. home, search, item, ...) in case you experience issues on particular pages with optimized file