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
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/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.