La prima volta che minifying JSON in realtà importava per me non era su un sito web - era su un microcontrollore Stavo spedendo un blob di configurazione a un dispositivo con pochi kilobyte di memoria da vendere, e la versione piuttosto stampata che stavo modificando a mano era quasi il doppio degli stessi dati con gli spazi bianchi rimossi Stessi tasti, stessi valori, stessa struttura - l'unica differenza erano migliaia di spazi e nuove linee che esistevano puramente in modo che un essere umano potesse leggerlo Spogliarli e il payload si adatta Questo è l'intero trucco dietro la minificazione, e si applica altrettanto a una risposta API servita un milione di volte al giorno come fa a un file di configurazione compresso su un chip.
Questa guida è la versione approfondita di come e perché minimizzare JSON, costruita attorno al free Minifier JSON strumento. spiegherò cosa rimuove la minificazione e cosa lascia deliberatamente solo, perché il JSON più piccolo è più veloce, come la minificazione differisce dalla formattazione e dall'evasione e una proprietà sottile - la precisione del numero - che separa un miniatore attento da uno imprudente Fa parte della stessa famiglia del Formattatore JSON Uso per il lavoro opposto e appartiene al kit di strumenti che ho esposto nel Guida definitiva agli strumenti JSON.
tl; dr: La minimizzazione di JSON rimuove ogni spazio, scheda e nuova riga che si trova tra i token, producendo il testo più piccolo che analizza esattamente gli stessi dati. Niente sulle chiavi, sui valori o sui loro cambiamenti di ordine: va solo lo spazio bianco Minifier JSON convalida prima il tuo input e segnala l'errore parser's esatto se non è valido, elimina gli spazi bianchi solo al di fuori dei valori letterali delle stringhe in modo che il testo all'interno dei tuoi valori non venga toccato e preserva i token numerici byte per byte in modo che un valore come 1.0 rimanga 1.0. Una modalità abbellisci inverte il processo con 2 spazi, 4 spazi o schede. Tutto viene eseguito nel browser.
Cosa fa effettivamente la minificazione di JSON?
Un documento JSON è una sequenza di token: parentesi graffe, parentesi graffe, virgole, stringhe, numeri e valori letterali true, false, e null. Tra questi gettoni, la grammatica JSON consente qualsiasi quantità di spazi bianchi e JSON, piuttosto stampato, utilizza tale tolleranza generosamente: una nuova riga dopo ogni virgola, due o quattro spazi di rientro per livello di nidificazione, uno spazio dopo ogni colon. Tutto quello spazio bianco è lì per gli occhi umani. Un parser lo ignora completamente.
La minimizzazione è l'atto di rimuovere ognuno di quegli insignificanti caratteri di spazi bianchi, lasciando solo i gettoni stessi e la minima punteggiatura richiesta dalla grammatica Una configurazione che si legge come quaranta linee rientrate collassa su una singola linea densa Fondamentalmente, il dati è identico - analizza la versione minificata e la versione graziosa e ottieni lo stesso identico oggetto, con le stesse chiavi nello stesso ordine e gli stessi valori La minimizzazione cambia la rappresentazione, mai il significato La grammatica su cui poggia tutto questo è pubblicata come RFC 8259, che è l'autorità su ciò che conta come spazi bianchi insignificanti e ciò che non lo fa.
L'unico posto in cui si trova lo spazio bianco no insignificante è dentro una stringa Gli spazi in "hello world" fanno parte del valore e devono sopravvivere intatto alla minificazione Un minifier corretto quindi non può semplicemente eliminare ogni spazio nel testo; deve tenere traccia se si trova all'interno di una stringa letterale e lasciare in pace quel contenuto Il Minifier JSON fa esattamente questo, camminando il testo carattere per carattere e lasciando cadere solo gli spazi bianchi che si trovano tra i gettoni, quindi uno spazio deliberato all'interno di uno dei tuoi valori non viene mai perso.
Perché preoccuparsi di minimizzare JSON?
Il motivo principale è la dimensione, e la dimensione si traduce direttamente in velocità e costo sul web Ogni byte di una risposta JSON deve viaggiare sulla rete, e per un payload richiesto migliaia o milioni di volte, gli spazi bianchi si sommano alla larghezza di banda reale Indentation e interruzioni di riga rappresentano comunemente da un quinto a un terzo di un documento piuttosto stampato' s size, quindi la minimizzazione può tagliare una fetta significativa di ogni trasferimento Le risposte più piccole arrivano più velocemente, specialmente su connessioni mobili lente, e costano meno da servire quando si paga per l'uscita Questo è il motivo per cui praticamente ogni API di produzione restituisce JSON minificato e ogni strumento di compilazione che raggruppa i dati in un'app web lo minimizza per primo.
C'è anche un vantaggio di analisi, anche se è più piccolo Un parser che non deve saltare le esecuzioni di spazi bianchi ha un po 'meno lavoro da fare, che conta ai margini per documenti molto grandi elaborati in un ciclo caldo E c'è un angolo di archiviazione che mi ha portato qui in primo luogo: quando si sta inserendo JSON in uno spazio vincolato - un cookie con un limite di dimensione, un dispositivo incorporato, una colonna di database con un cap, un parametro di query URL - il modulo minificato è ciò che lo rende adatto Il badge di risparmio di dimensioni nello strumento ti mostra il prima e dopo in byte e la riduzione percentuale, in modo da poter vedere immediatamente se un dato documento vale la pena di essere minificato o era già magro.
Cosa fa il minifying no buy you is secrecy or compression in the heavyweight sense Minified JSON è ancora testo semplice e ancora perfettamente leggibile a tutto ciò che lo analizza; rimuovere gli spazi bianchi non è crittografia e non gzip Sul filo, JSON è solitamente compresso in gzip oltre alla minificazione, e i due sono complementari - la minificazione rimuove la ridondanza consentita dalla grammatica, e gzip rimuove la ridondanza nel flusso di byte Minimifica per le ragioni sopra, non perché pensi che nasconda qualcosa.
In che modo la minimizzazione è diversa dalla formattazione, dall'escape e dalla compressione?
Queste quattro operazioni vengono confuse costantemente e mantenerle dritte ti evita di cercare lo strumento sbagliato. Agiscono su cose diverse e risolvono problemi diversi.
Minimizzare rimuove gli spazi bianchi insignificanti per rimpicciolire un documento mantenendolo valido JSON. Formattazione, o abbellire, fa il contrario: aggiunge il rientro e le interruzioni di riga per rendere leggibile un documento, che è ciò che si desidera quando si esegue il debug di una risposta API o si modifica manualmente una configurazione Minifier JSON fa entrambi, perché sono due direzioni dello stesso asse - minify per le macchine, abbellire per le persone. Fuggendo è un asse completamente diverso: rende sicuro posizionare un pezzo di testo interiore una stringa JSON trasformando virgolette e caratteri di controllo in sequenze di barra rovesciata, che è il lavoro del Fuga di JSON / Unescape strumento. E compressione come gzip opera su byte grezzi sotto lo strato JSON, riducendo ulteriormente il trasferimento dopo che la minimizzazione ha fatto la sua parte.
La tabella espone le distinzioni e i punti allo strumento giusto per ciascuno.
| Operazione | Cosa cambia | Risultato è ancora JSON? | strumento |
|---|---|---|---|
| minimizzare | Rimuove gli spazi bianchi tra i token | Sì, stessi dati | Minifier JSON |
| Abbellisci/formato | Aggiunge indentazione e interruzioni di riga | Sì, stessi dati | Formattatore JSON |
| Fuga | Codifica il testo per sedersi all'interno di una stringa JSON | Diventa un valore stringa | Fuga di JSON / Unescape |
| Minimizza CSS | Rimuove gli spazi bianchi da un foglio di stile | È CSS, non JSON | Minifier CSS |
| Minimizza HTML | Rimuove gli spazi bianchi dal markup | È HTML, non JSON | Minifier HTML |
La stessa idea di minify-for-shipping viene eseguita su formati, motivo per cui il Minifier CSS e Minifier HTML siediti proprio accanto a questo: una build completa minimizza i dati JSON, il foglio di stile e il markup per gli stessi motivi di larghezza di banda.
Minifying JSON cambia mai i miei dati?
La risposta corretta è che la minificazione dovrebbe mai cambia i tuoi dati, e un buon strumento lo garantisce Ma c'è una sottigliezza che separa un miniatore attento da uno ingenuo, e vale la pena capirlo perché può morderti.
Molti minifier funzionano analizzando il JSON in un oggetto in memoria e quindi riserializzandolo senza spazi bianchi. Quel viaggio di andata e ritorno è conveniente, ma significa che ogni valore passa attraverso il linguaggio's tipo di numero in arrivo e che può riscrivere il modo in cui sono i numeri scritto anche se il valore matematico è invariato Un valore che hai scritto come 1.0 torna come 1. Un valore come 1e3 torna come 1000. Un numero intero con più cifre rispetto al linguaggio's tipo di numero può tenere precisamente - qualsiasi cosa oltre circa sedici cifre significative - può tornare sottilmente alterato Per la maggior parte dei documenti nulla di tutto questo ha importanza, ma se il vostro JSON porta stringhe di versione, identificatori di database, o decimali a precisione fissa come numeri, un minifier di reparse-and-restringify può tranquillamente corromperli.
la Minifier JSON evita la trappola minificando in modo diverso Ancora validate il tuo input analizzandolo, quindi JSON malformato viene catturato e segnalato Ma per produrre l'output rimuove gli spazi bianchi direttamente dal tuo testo originale piuttosto che riserializzare un oggetto analizzato, il che significa che ogni token numerico viene conservato esattamente come lo hai scritto. Uno zero finale 1.0 soggiorni 1.0; un numero intero di trenta cifre mantiene tutte e trenta le cifre Ottieni la riduzione dimensionale della minificazione senza alcun rischio che i tuoi numeri vengano riscritti: il meglio della convalida e della fedeltà byte per byte. La direzione di abbellimento, che riguarda la leggibilità piuttosto che il trasporto, normalizza la formattazione attraverso una riserializzazione standard, che è il comportamento atteso quando si riformatta per la lettura umana.
Come faccio a leggere gli errori quando il mio JSON non minify?
Lo strumento si convalida prima di minimizzare, il che significa che un documento non valido produce un errore anziché un output interrotto - e quell'errore è una funzionalità, non un ostacolo Ti dice che il JSON ha un problema reale prima lo spedisci da qualche parte che lo rifiuterebbe meno utilmente.
I messaggi provengono direttamente dal parser JavaScript JSON e di solito nominano una posizione Le cause più comuni sono una virgola finale dopo l'ultimo elemento di un array o di un oggetto, che JSON rigoroso vieta; una chiave che non è avvolta in virgolette doppie, poiché JSON richiede chiavi citate a differenza degli oggetti letterali JavaScript; una stringa che utilizza virgolette singole invece di doppie; e una parentesi o parentesi graffa sbilanciata in cui qualcosa è stato aperto e non chiuso Ognuna di queste è una piccola correzione una volta che sai dove guardare e la posizione riportata ti punta verso il quartiere Se la tua fonte è effettivamente JSONC - JSON con commenti e virgolette finali, come usato in alcuni file di configurazione - non minimizzerà così com'è, perché si tratta di estensioni piuttosto che JSON standard; spoglia prima i commenti e le virgole finali, o converti in JSON rigoroso, e sarà valido.
Quando la struttura è valida ma non si vede perché due documenti si comportano diversamente, abbelliscono entrambi e li confrontano, oppure li eseguono attraverso il JSON DIFF strumento per vedere esattamente quali chiavi o valori differiscono Il debug di JSON è molto più semplice nella sua forma graziosa, che è il caso quotidiano che ho realizzato nel Guida di JSON FormatterE poiché tutta questa convalida e minimizzazione avviene nel tuo browser senza nulla caricato, puoi incollare in sicurezza i payload che contengono chiavi API, token o record dei clienti: l'argomento sulla privacy che ho esposto integralmente nel guida alla privacy dei dati per gli strumenti online.
Un esempio funzionante: dalla configurazione leggibile al payload spedito
Ecco il viaggio di andata e ritorno che mostra lo strumento che guadagna il suo posto Supponiamo che tu abbia modificato una configurazione di servizio a mano, quindi è abbastanza stampato per la leggibilità - tasti oggetto sulle loro linee, rientro a due spazi, una struttura vuota che è facile da scansionare Prima che entri in una variabile d'ambiente con un limite di lunghezza, lo vuoi il più piccolo possibile.
Incolla la configurazione nel file Minifier JSON, fare clic su Minify, e si comprime in una singola riga Il badge di dimensione potrebbe leggere qualcosa come 512 byte fino a 340, una riduzione di un terzo, che è la differenza tra l'adattamento della variabile' s limite e no. Copia la linea minificata direttamente nel file di ambiente Nota che un timeout che hai scritto come 1.5 è fermo 1.5 e un nuovo conteggio di 3 è fermo 3 - i numeri non sono toccati e se avessi un lungo identificatore numerico sopravviverebbe intatto anche lui, perché lo strumento ha eliminato gli spazi bianchi anziché riparsare i valori.
Settimane dopo una segnalazione di bug ti fa fissare quello stesso blob minificato in un registro, ed è illeggibile come una linea densa Incollalo di nuovo nello strumento, fai clic su Abbellisci, scegli due spazi e si espande nella forma rientrata che puoi effettivamente scansionare Fissa il valore, minifica di nuovo, spedisci di nuovo Quel flusso bidirezionale - abbellisci per leggere e modificare, minifica per archiviare e inviare - è il ritmo quotidiano, e avere entrambi in un unico posto con una lettura delle dimensioni e un reporting esatto degli errori è ciò che lo rende rapido Per l'insieme più ampio di utilità di costruzione e spedizione che si trova tra, il Toolkit per sviluppatori web arrotonda il resto.
Domande frequenti
Come faccio a minimizzare JSON online? Incolla il tuo JSON nell'area di input e fai clic su Minifica Lo strumento rimuove tutti i valori delle stringhe esterne agli spazi bianchi e mostra il risultato compresso insieme al risparmio di dimensioni Tutto viene eseguito nel tuo browser, quindi non viene caricato nulla.
La minimizzazione di JSON modifica i dati? No. La minimizzazione rimuove solo gli spazi bianchi tra i token, quindi le chiavi, i valori e il loro ordine rimangono identici Un documento minificato viene analizzato esattamente sullo stesso oggetto o array di quello originale stampato in modo grazioso.
Perché minimizzare JSON? Il JSON ridotto al minimo è più piccolo, quindi si trasferisce più velocemente sulla rete, utilizza meno larghezza di banda e analizza leggermente più rapidamente Le risposte API, i file di configurazione e i dati raggruppati nelle app Web vengono generalmente ridotti al minimo in produzione per questi motivi.
Questo strumento conserva la formattazione dei numeri come 1.0 o grandi numeri interi? Sì. Poiché rimuove gli spazi bianchi anziché ridare l'analisi dei valori, i token numerici vengono mantenuti esattamente come li hai scritti. Un valore come 1.0 rimane 1.0 e un numero intero molto grande mantiene tutte le sue cifre, che un minifier di analisi e restrizione riscriverebbe.
Qual è la differenza tra minifying e beautifying JSON? La minimizzazione rimuove gli spazi bianchi per rendere JSON il più piccolo possibile per le macchine, mentre l'abbellimento aggiunge il rientro e le interruzioni di riga per renderlo leggibile per le persone Questo strumento fa entrambe le cose: minify per la spedizione, abbellire per la modifica e il debug.
Può minimizzare JSON con commenti o virgole finali? No. Standard JSON non consente commenti o virgole finali, quindi lo strumento segnala quelli come errori durante la convalida Rimuovi prima i commenti e le virgole finali oppure converti il tuo JSONC in JSON rigoroso, quindi minifica.
È sicuro minify sensibile JSON qui? Sì. Tutta l'elaborazione avviene in JavaScript all'interno del browser, quindi nessun JSON viene inviato a nessun server, non viene registrato nulla e lo strumento funziona con la connessione disabilitata Puoi tranquillamente minimizzare i payload che contengono chiavi API o dati personali.
Perché il mio JSON mostra un errore invece di minimizzare? Lo strumento convalida il tuo input prima di minimizzare, quindi un errore significa che il JSON è malformato, di solito una virgola mancante o extra, una chiave non quotata, una stringa a virgolette singole o una parentesi sbilanciata Il messaggio include la posizione del problema in modo da poterlo risolvere.
Questa guida accompagna il libero Minifier JSON strumento su Toolz.dev - nessuna iscrizione, nessun caricamento, funziona offline.
