Are CSS utility classes a mild form of obfuscation?

If I see something interesting or novel on a website, I like to investigate how it was made. Since the early days of the web, “view source” in browsers has been a portal for discovery for curious folks.

Now, “view source” is packaged into a suite of m…


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by Rob O'Leary

If I see something interesting or novel on a website, I like to investigate how it was made. Since the early days of the web, "view source" in browsers has been a portal for discovery for curious folks.

Now, "view source" is packaged into a suite of much more sophisticated tools that we refer to as devtools. Now, we can explore the HTML and CSS and JS of webpages in very intricate ways.

I find exploring webpages througn devtools a great way to learn and grow as a developer. The world wide web is your oyster.

Today, I saw a nice noisy effect on the background of a website. I wanted to satisfy my curiousity on the providence of the effect. My guess was that it was a SVG filter.

So, I opened the devtools looking to extract the code to recreate a minimal example. I looked through the elements in the body and found a svg that contained a filter. My hunch was correct! 🕵️

Then to my surprise, when I examined its styles in the style pane, there was lots of very short classes. 😐 They look like utility classes to me.

This makes for multiple rounds of copying-and-pasting from the style pane to recreate the effect! Its probably just quicker to type out the same declarations myself!

I don't know how you would classify this. It seems kind of like an unintended consequence of utilty CSS frameworks to me. It acts as a mild obfuscation method when you approach things with a CSS hat on. 👷 It will slow down curious folks like me from digging around webpages. Is that a good or bad thing?

It's not a big deal, but I don't like impediments on my CSS excursions! It is a bit of buzz-kill. Maybe some businesses would like to make it harder for people to imitate parts of their website, so it might be a welcome side effect for them!

Them are the jigs and reels I guess! 😁


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by Rob O'Leary


Print Share Comment Cite Upload Translate Updates
APA

Rob O'Leary | Sciencx (2022-11-04T18:54:10+00:00) Are CSS utility classes a mild form of obfuscation?. Retrieved from https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/

MLA
" » Are CSS utility classes a mild form of obfuscation?." Rob O'Leary | Sciencx - Friday November 4, 2022, https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/
HARVARD
Rob O'Leary | Sciencx Friday November 4, 2022 » Are CSS utility classes a mild form of obfuscation?., viewed ,<https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/>
VANCOUVER
Rob O'Leary | Sciencx - » Are CSS utility classes a mild form of obfuscation?. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/
CHICAGO
" » Are CSS utility classes a mild form of obfuscation?." Rob O'Leary | Sciencx - Accessed . https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/
IEEE
" » Are CSS utility classes a mild form of obfuscation?." Rob O'Leary | Sciencx [Online]. Available: https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/. [Accessed: ]
rf:citation
» Are CSS utility classes a mild form of obfuscation? | Rob O'Leary | Sciencx | https://www.scien.cx/2022/11/04/are-css-utility-classes-a-mild-form-of-obfuscation/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.