Minify class names on Sage 10

sage
#1

Hello everybody

I have been looking online and tried several things on a staging site but I haven’t been able to minify the class names of my Sage 10 theme. Anyone know what should I do to obscure/obsfuscate/minify my theme class names? Thank you

#2

Several approaches come to mind:

  • A server extension like pagespeed for nginx/apache.
  • An optimizer proxy.
  • A WordPress plugin that does the this on the HTML and enqueued CSS.

One could minify the classes during build time, first in the stylesheet, with a map that maps the original class names to their minified counterparts, then minify during Blade-PHP (and PHP) render.
This works when the classes use is limited to the theme markup.

The question is: Why do you need this? For security? For performance?
Does it actually improve either of these?

1 Like
#3

Thanks for your response. Actually, I was trying to do something like this:

The reason I’m digging about this is because my client doesn’t want people to be able to copy/paste their layout as people are exploiting this for bad purposes. It makes sense to make harder for bad actors to replicate the site layout.

I had this on my list before because I was interested in reducing the size of the page in a couple of views, but I never ended up implementing it.

#4

That tutorial uses laravel-mix, while latest Sage 10 uses bud.
However, as just custom webpack config is used, it shouldn’t be very different for injecting it with bud instead.
Sage 10 already uses PHP-Blade and Laravel components, the same code in that tutorial should be usable.

However, I am not sure whether this obfuscation really helps with preventing copying the markup and styles.

1 Like
#5

I agree. Anyways they can do it, but my client doesn’t think like us, unfortunately… :pensive: