JSON Minify

Видаліть пробіли з JSON і побачте, скільки байтів вдалось зекономити

JSON

Стиснутий

JSON Minify

Видаліть пробіли з JSON і побачте, скільки байтів вдалось зекономити

Можливості

  • Мініфікація одним викликом JSON.parse + JSON.stringify — проходить через справжній парсер, тож синтаксично некоректний ввід швидко падає з точним повідомленням рушія JavaScript
  • Точна за байтами статистика розміру: TextEncoder.encode().length вимірює UTF-8-байти (не кількість символів), тож багатобайтні символи та емодзі зважуються коректно
  • Рядок економії показує абсолютну різницю в байтах і відсоток від розміру входу — відповідає тому, як виглядатиме minify-потім-gzip-навантаження по проводу
  • Кнопка «Копіювати» на 1,5 с переходить у «Скопійовано!» після натискання, чітко підтверджуючи успіх запису в буфер — без тихих збоїв
  • Кнопка «Завантажити» видає Blob `minified.json` з MIME application/json, готовий покласти в тіло HTTP-запиту або закомітити в папку фікстур
  • Помилки розбору з'являються з повним повідомленням JS-рушія (рядок/колонка, коли парсер їх надає), тож можна вказати на проблемний символ замість гадати
  • Повністю на стороні клієнта: ввід не залишає браузер, без телеметрії, без завантаження. Виклик minify синхронний і миттєвий для типових конфігів (JSON менш ніж мегабайт)
  • Вихід зберігає порядок ключів і точне числове представлення — JSON.stringify не перекодовує цілі як float і не змінює Unicode-еск'юпи, тож мініфікований вихід байт-еквівалентний тому, що суворий споживач повторно розбере

Як використовувати

  1. Вставте свій JSON у ліву панель вводу.
  2. Натисніть «Стиснути». Інструмент запускає JSON.parse для перевірки, потім JSON.stringify без аргументу відступу, видаляючи всі незначущі пробіли.
  3. Прочитайте рядок статистики: байти входу, байти виходу та зекономлені байти/відсоток — корисно для рішення, чи варта мініфікація компромісу з читабельністю.
  4. Натисніть «Копіювати», щоб покласти мініфікований рядок у буфер, або «Завантажити», щоб зберегти як `minified.json`.
  5. Якщо ввід був недійсний, червоний рядок помилки покаже повідомлення розбору JS-рушія — виправте JSON і знову натисніть «Стиснути».

Поради та найкращі практики

  • Якщо мініфікуєте переважно заради бюджету бандла, увімкніть також gzip у CI-пайплайні статичних ассетів — gzip'ований pretty JSON часто менший за нестиснений мініфікований.
  • Тримайте оригінальний pretty-print JSON у системі контролю версій; мініфікуйте у кроці збірки замість комітити мініфіковану версію.
  • Для дуже великого JSON (10 МБ+) прохід TextEncoder досі швидкий, але пара JSON.parse + JSON.stringify коротко стрибає по пам'яті — нормально у вкладці браузера, проблемно у гарячому шляху service worker.
  • Якщо JSON містить числа поряд із безпечним цілочисельним лімітом JS (2^53), пам'ятайте: JSON.parse перетворює їх на double — minify цього не змінює, але корисно знати перед налагодженням невідповідності точності.
  • Використайте «Завантажити», щоб покласти мініфікований файл у каталог фікстур; пізніше зіставте з JSON Diff, якщо треба підтвердити, що круговий хід зберіг усе.

Запитання та відповіді

Наскільки зменшиться мій JSON?

Повністю залежить від того, скільки пробілів було спочатку. Сильно pretty-printed конфіг (відступ 2 пробіли, вирівнювання ключів, кінцеві переноси рядка) часто стискається на 30–50 %. JSON уже в одному рядку стискається на 0 %. Рядок статистики повідомляє точне число — спробуйте на своїх даних перед фіксацією мініфікованої версії.

Чи варто мініфікувати JSON у продакшені?

Зазвичай ні, бо стиснення gzip/brotli вже зводить повторювані пробіли до кількох байтів. Мініфікація допомагає, коли (1) не можна ввімкнути стиснення на транспорті (деякі вбудовані цілі), (2) ви вбудовуєте JSON у JS-бандл, де кожен байт зараховується в бюджет бандла, або (3) оптимізуєте IndexedDB/localStorage, де транспортного стиснення немає.

Чи змінить це мої дані?

Ні. JSON.parse + JSON.stringify — це двосторонній прохід через специфікацію JSON JavaScript, сувору підмножину ECMAScript. Числа, рядки, булеві, null, масиви та об'єкти виходять байт-еквівалентними до коректного повторного розбору. Єдина різниця — пробіли та порядок ключів (JSON.stringify зберігає вихідний порядок вставлення літералу об'єкта).

Як рахуються байти?

Через TextEncoder().encode().length, що дає довжину в UTF-8 байтах. Чистий ASCII — один байт на символ; é — два байти; більшість CJK-символів — три; більшість емодзі — чотири. Підрахунок довжини JavaScript-рядка (кодових одиниць) перебільшив би ASCII й недооцінив символи додаткової площини; TextEncoder дає число, що відповідає тому, що йде по проводу.

Чому Minify падає на моєму вводі?

JSON.parse суворий: без хвостових ком, без коментарів, без одинарних лапок навколо рядків, без некомочених ключів. Якщо ви працюєте з розслабленим JSON (JSON5, JSONC), парсер кине — попередньо обробіть розслабленим парсером або скористайтеся режимом JSONC у JSON Formatter, щоб очистити. Рядок помилки показує повідомлення рушія, часто з рядком/колонкою, що зламали.

Чи надсилається щось на сервер?

Ні. Обидві панелі залишаються у вашому браузері; мініфікація працює синхронно в тому ж JavaScript-контексті, що відрендерив сторінку. Вкладка «Мережа» DevTools не показує запитів при натисканні «Стиснути». Сторінка працює офлайн після першого завантаження.

Чи залишиться мініфікований JSON дружнім до diff?

Менше. Pretty-print JSON-файл диффиться построково, і рев'юери бачать, який саме ключ змінився. Мініфікований JSON-файл — один величезний рядок; правка одного символу виглядає як заміна всього рядка в `git diff`. Тримайте джерела pretty-print; мініфікуйте лише для транспорту або зберігання.

Чим це відрізняється від JSON Formatter?

У JSON Formatter є кнопка Minify поряд з Pretty-Print плюс дерево, JSONPath, JSONC, валідація схеми та diff. Цей інструмент — одна задача, легкий: вставити, стиснути, копіювати, завантажити — без панелей, без режимів, лише зекономлені байти.