Remove unused CSS

Elise hi,

Basel is really good, and I managed to speed it up to 0.7-0.9s load time on PC (GTMEtrix) when running Basel + WP Rocket. So you should definitely a credit on Themeforest for it. https://ibb.co/QDF6nY6
https://gtmetrix.com/reports/www.independent.wine/uh4xNaLj

People advertise how they achieve 98% on GTMetrix with a simple WP blog, but a multi-purpose web shop theme is much harder – so here it is 98%, 0.7s load time with Basel.

But on mobile it’s quite slow! Because CSS file is big (200kb after WP Rocket), and has many styles which I do not use (such as Dark theme). I want to manually remove unused bits from style.css (very carefully!), can you please confirm: if I uncheck “Minify CSS” in Basel>Performance, will the theme load the full big file style.css (public_html/wp-content/themes/basel/style.css)?

(some background info:
I use WP Rocket. Unfortunately, if I enable setting “Minify CSS” (use style.min.css->cashe style.min-5.1.2.css) in the Basel>Performance, there is a conflict with WP Rocket CSS optimisation. For several hours all is fine, and all of a sudden WP Rocket fails to load CSS used in Basel Theme settings – such as fonts, colours, etc, and loads default style.min-5.1.2.css. So I have to go back, clear the cashe on the server, disable WP Rocket CSS optimisation and enable again. For serveral hours, all is fine again, and then the problem repeats.

Also, the site loads much faster if I disable “Minify CSS” in Basel + minify CSS in WP Rocket.)

Hello,

We are glad that you have such good results about your website performance based on our theme.
Yes, you can disable the minify CSS option, and then the original version of the style.css file will be loaded.

Kind Regards

Hi Oleg, are you a web developer? Would love to have you improve speed on our site.

Hi IM,

I am a tech-minded business ownwer, and I optimise the site not with crazy customizations, but using my head. First thing is, Basel by itself is pretty fast, if you unload it from other fat plugins (see below).

I am against using developers/code-smashers to customize Bazel, they just rewrite the theme code, and if something goes wrong it’s out of support.

I understand that you cannot “disable all plugins to see whare is the problem” – this is impossible in a live shop – it’s the same as if your doctor said “remove your liver, kidney, and all other organs one by one until we see what’s causing your heart rate problem” :)))))
I cannot give you an advice, but I can share what I did – my hard-earned experience how to speed up XTEMOS “Basel”. I hope guys at XTEMOS will not be against what I say:

1) move to a fast hosting. SiteGround is fast, if you use them choose “GoGeek” shared plan, you will have plenty of hardware resources. Do not use Cloud dedicated servers, because cheap (2CPU) is not enough for WordPress, more powerful (4-6CPU) is crazy expensive. Beware – SiteGround recently changes their support policy, if you contact them 10-15 times thery ban you from chat support, and take 1-5 days to respond to tickets (maybe OK for personal blog but not good for real business). I am in the UK, so I moved from SiteGroung to UKFast – about the same speed, but good support.

2) Optimise images – I use EWWW Image Optimizer, but there is a number of similar plugins.

3) For caching plugin, use WP Rocket, paid version. Do not use other caching/speed optimization plugins, they conflict with each other. If you are (or will be) on SiteGround, uninstall SG Optimizer, use WP Rocket. Disable “CSS minification” and “JS Minification” in Basel, use those functions in WP Rocket. It becomes faster.

4) Uninstall the standard “Contact form 7”, it is heavy and slows down your site. Replace it with “Simple Basic Contact Form” – it is possibly the lightest/fastest contact form.

4) Uninstall Mailchimp plugin and MC4WP, they are huge, and slow down your website. Mailchimp used to be offer a free plan, but now it is only up to 1000 active + non-active users, and when you exceed that they put you on a very expensive plan (something line $79). There are many alrternatives, for free and lightweight newsletter plugin use “Noptin”. It is much lighter than the popular plugin “Newsletter” (“Noptin” code size is 1mb, “Newsletter” is 4mb).

5) Remove “Slider Revolution” plugin, it’s heavy. This type of animation used to be cool 5 years ago, but now it looks cheesy. IMHO the drag on performance is not worth it.

Again, this is my experience, not advice. Hope that gives you some ideas.

[Author]

Posts