Perché Facebook nasconde i nomi delle classi CSS?

6

Se guardi il codice sorgente di un sito web come Facebook, vedrai molte classi in quanto tali:

<div class="_cy6 _2s24"><div class="_4kny"><div class="uiToggle _8-a _1kj2 _4d1i _-57 _5-sk" id="u_0_8"><a data-hover="tooltip" data-tooltip-content="Quick Help" data-onclick="[[&quot;HelpLiteFlyoutBootloader&quot;,&quot;loadFlyout&quot;]]" class="_59fc" href="#" rel="toggle" role="button" data-tooltip-delay="500" aria-haspopup="true" aria-controls="u_0_7" aria-label="Help Center" data-testid="contextual_help_jewel_button"><div class="_59fb _tmz"></div></a><div id="u_0_7" class="__tw _8-b _tdb toggleTargetClosed uiToggleFlyout"><div class="beeperNub"></div><div id="fbHelpLiteFlyout"><div id="fbHelpLiteFlyoutLoading" class="_5uco"><img class="_26y2 img" src="https://www.facebook.com/rsrc.php/v3/yb/r/GsNJNwuI-UM.gif"alt="" width="16" height="11" /></div></div>

Ad occhio nudo, sembrano classi chiamate con un nome gergale. Tuttavia, non sono sicuro del motivo per cui sono stati offuscati. Non vedo una classe denominata qualcosa come post con classi significative su elementi figlio. C'è una ragione per questa pratica? Vedo molti siti Web di grandi dimensioni come Facebook che eseguono questo modello e non sono sicuro se c'è un motivo.

    
posta 1234567 17.06.2017 - 02:43
fonte

2 risposte

11

Si chiama minification . Rende più piccoli i file CSS (e potenzialmente anche i file Javascript), che richiedono meno larghezza di banda per il download. Questo può fare una differenza significativa nelle prestazioni, specialmente per i dispositivi wireless.

    
risposta data 17.06.2017 - 03:22
fonte
1

Questo non è un deliberato obfusticatian.

Attraverso una combinazione di transpiling e minification puoi finire con una sorgente di pagina nel browser che non assomiglia al codice sorgente originale.

    
risposta data 17.06.2017 - 03:22
fonte