Google Chrome nel tempo è diventato davvero uno strumento completo sotto ogni punto di vista. Quello che presento oggi è la possibilità di decomprimere file javascript e css, portandoli ad una visualizzazione più “human friendly” o “human readable” come direbbero gli anglofoni.
Per prima cosa è necessario entrare in modalità sviluppo, ad esempio tasto destro su una pagina web, quindi scegliamo l’opzione “ispeziona” dal menù a tendina.
Qui andando alla voce “Sources” potremo accedere ad una sorta di rappresentazione del filesystem remoto. In realtà non è così, ovvero solo in parte lo è, nel senso che ogni sito che vediamo deve essere scaricato e quindi interpretato dal browser che lo traduce graficamente in ciò che vediamo. Tuttavia il codice, sebbene in parte possa essere pre-compilato, è accessibile a chiunque.
Quindi premiamo Command o Control +P e vedremo scendere una tendina, se cerchiamo i file javascript possiamo scrivere .js e vedremo apparire nella lista tutti i file con estensione .js, javascript appunto. La stessa cosa la possiamo far con i file CSS cercando l’estensione .css.
Scegliendo uno di questi file è possibile che lo vediamo in modo compresso, ovvero scritto tutto in una riga, senza spazi e commenti. E’ il processo di “minificazione”, o compressione in un italiano più comprensibile. Non è l’ideale per poter comprendere il codice che abbiamo davanti, infatti non si capisce nulla ed è persino difficile leggere qualche carattere che possa sembrare vagamente comprensibile.
Chrome ci mette a disposizione il processo inverso. Ovviamente i commenti se non sono espressamente presenti nel file compresso (cioè mai) non saranno presenti sul file de-compresso, ma se non altro il codice lo vedremo indentato e nidificato correttamente in modo da essere visivamente d’aiuto nella lettura e comprensione. Infatti nella schermata che mostra il codice in basso a sinistra è presente un tasto con due parentesi graffe, se lo premiamo vedremo lo stesso in modalità decompressa
E se voglio utilizzare un file locale?
In effetti quanto esposto fino ad ora ha un piccolo problema, il file che possiamo decomprimere sono quelli di un sito web, cioè di entità virtualmente non modificabili che arrivano da internet. Ma possiamo fare lo stesso per un file che abbiamo in locale?
La risposta è si. Al lato sinistro della finestra dove viene mostrato il codice è presente una sezione che mostra “l’alberatura” dei file. Nel caso specifico quelli del sito web che stiamo analizzando, ma se facciamo caso in alto a questa sezione sono presenti le voci “Page” e “Filesystem“. Proprio Filesystem è quella che ci viene in aiuto, infatti selezionandola potremo indicare a Chrome la possibilità di leggere una cartella all’interno del nostro Filesystem locale. Questo però si traduce in un potenziale breccia di sicurezza poiché un sito (che stiamo visitando) potrebbe avere accesso ai nostri file locali. Si tratta però di una condizione quanto meno rara considerando che potremo fare quanto necessario e poi uscire. Comunque Chrome chiede esplicitamente il consenso a poter leggere file locali. Purtroppo questo consenso non è propriamente ben congegnato, infatti si palesa in alto poco sotto dove si scrivono le URL o sotto la barra dei preferiti se l’avete attivata. Se utilizzate la modalità sviluppo ancorata sul fondo è molto probabile che non vi accorgerete di questo avviso, che tuttavia si è propagato in tutte le tab attive, se ve ne sono in quel momento.
Quando abbiamo terminato è necessario scaricare l’accesso dal sistema di sviluppo. Infatti questo accesso rimarrà anche se chiudiamo la modalità sviluppo e anche se chiudiamo il browser. Per revocare l’accesso al Filesystem non ci resta altro che premere sulla voce “Remove folder from Workspace” sulla cartella evidenziata.
Attenzione, questa parte è molto importante, perché ogni sito potenzialmente potrebbe avere accesso a quella cartella. Quindi non dimenticatevi di saltare questo passaggio!