TGViewer
Defront — про фронтенд-разработку и не только Defront — про фронтенд-разработку и не только @defront · 5.04K subscribers
Post #212 1.35K
Нашёл интересную статью Омара Шехата про работу с бинарными данными в браузере — "Binary data in the browser: Untangling an encoding mess with JavaScript Typed Arrays".

Омар кодил приложение для визуального создания полиритмов с возможностью загрузки полученной мелодии в виде midi-файла без использования бэкенда. Для генерации midi он использовал библиотеку jsmidgen, которая без проблем работала в node.js, но в браузере результат получался битым.

Сначала было предположение, что по каким-то причинам некорректно работал jsmidgen, но дебаг это не подтвердил. Потом автор предположил, что проблема возникает при передаче строки в Blob. Он принудительно перевёл каждый символ результата в uint8 с помощью типизированного массива, и это решило проблему. Далее в статье идёт детальный разбор того, почему первый подход к решению задачи был неудачным. Если говорить кратко, то проблема заключалась в том, что при передаче в Blob строка кодируется в UTF-8. В UTF-8 один символ может быть закодирован с помощью одного или двух байт.

Статья хорошая с большим количеством деталей описания сути проблемы. Автор с юмором пишет про все грабли, на которые наступил.

#js #encoding #binary #midi

https://blog.logrocket.com/binary-data-in-the-browser-untangling-an-encoding-mess-with-javascript-typed-arrays-119673c0f1fe/
LogRocket Blog Binary data in the browser: Untangling an encoding mess with JavaScript Typed Arrays - LogRocket Blog Face the black magic of working with binary data on the web with JavaScript Typed Arrays, giving you the control you need over your data in the browser.
More from @defront
  1. Jan 7, 2024Channel name was changed to «Defront — про фронтенд-разработку и не только»
  2. Feb 24, 2022Про войну в Украине Шлю лучи поддержки братьям и сёстрам украинцам. В моём окружении нет н…
  3. Feb 23, 2022Qwik — возобновляемый JavaScript-фреймворк Райан Карниато поделился своими мыслями после р…
  4. Feb 22, 2022Обработка ошибок с помощью reportError Стэфан Джудис рассказал про малоизвестный метод для…
  5. Feb 21, 2022Выбор библиотеки по её размеру Владимир Клепов рассказал про подводные камни выбора библио…
  6. Feb 10, 2022Time-travel debugging в Svelte Сэм Ван Тассел рассказал про DeLorian — новый инструмент дл…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →