Инструменты повышения производительности разработчика: 40, которые я открываю каждую неделю

Я держу окно браузера открытым на своем втором мониторе, который является не чем иным, как вкладками служебных программ. Форматтер JSON, преобразователь времени, регулярный тестер, хэш-генератор. Он был там в течение многих лет, через релизы WP Adminify, через проекты Laravel, через каждую ночной сеанс отладки, когда полезная нагрузка Webhook прибывает, и мне нужно посмотреть, что на самом деле в нем.

Долгое время эти вкладки указывали на семь разных веб-сайтов Некоторые были в порядке Некоторые были рекламные фермы, которые загрузили мою полезную нагрузку на сервер I' никогда не слышали о. Один из них - I'm не собираюсь называть его - я вставил постановку JWT в до того, как меня догнала мысль: Этот жетон просто прошел по проводу к чужой коробке. Это был постановочный знак, ничего не сгорело, но чувство застряло. Я построил Toolz.dev отчасти потому, что мне нужна была моя собственная полоска вкладок, а отчасти потому, что я никогда не хотел снова совершать эту конкретную ошибку.

Так что это не список из 500 инструментов, вырезанных из каталога. это набор, на котором на самом деле живут Toolz.dev прямо сейчас - 40 с лишним из них - организовали способ, которым я их использую: к моменту рабочего дня, когда я дотягиваюсь до одного. каждый бежит в вашем браузере. ничего не загружается. аккаунта нет.

TL;DR: Пятерка я открываю больше всего на милю: Форматтер JSON Для нечитаемых ответов API Конвертер времени отметки времени Для криминалистики журнала, Тестер регулярного выражения Для работы с шаблонами, Конвертер Base64 Для JWTS и URI данных, а также Генератор UUID для посева тестовых данных Все, что ниже запускается на стороне клиента - ваша полезная нагрузка никогда не покидает вкладку Если вы только закладываете одну вещь, добавьте в закладки форматировщик JSON.

Почему бы просто не использовать CLI?

Справедливый вопрос, и я использую CLI. jq лучше, чем любой веб-инструмент для скриптов. base64 -d это два нажатия клавиш. Если задача входит в сценарий оболочки, она принадлежит сценарию оболочки.

Но есть три ситуации, когда вкладка браузера действительно выигрывает, и примерно через десять лет я перестал чувствовать себя виноватыми:

1. Визуальные петли обратной связи. Регулярное выражение является очевидным. Видеть 14 совпадений в образце реального текста, когда вы печатаете, — это другое действие, чем запуск. grep -P и получение да/нет. То же самое касается градиентов и цветов - вы не можете увидеть шестигранный код.
2. Машина не твоя. Клиентский ноутбук, заблокированная рабочая машина, чужой стол во время сеанса сопряжения. нет jq, нет прав на установку, нет времени.
3. Задача действительно одноразовая. Я не пишу скрипт Python для преобразования одного CSV в JSON. Я собираюсь наклеить его, нажать и жить дальше.

Вот честное сравнение, которое я бы поставил младшему разработчику, спрашивающему, что использовать:

Эта последняя строка является фактическим правилом, которому я следую. Если я собираюсь сделать что-то более двух раз, то это будет в скрипте. Все остальное получает вкладку.

Какие инструменты я открываю в плохой день API?

Это кластер, который зарабатывает на его сохранение. Сторонний API ведет себя неверно, у вас есть полезная нагрузка, и вам нужно понять ее, прежде чем что-то исправить.

JSON Formatter - тот, который I'd сохранит, если бы я мог оставить только один

Миниатюрный JSON нечитаем, а хуже того, когда он недействительный Ошибка браузера говорит вам «неожиданный токен», а смещение символов, которое ничего не значит для человека. выше Форматтер JSON красиво печатает его с реальным отступом и указывает на фактическую линию, которая 's сломана. Девяносто процентов времени виновником является конечная запятая, что законно в литералах объектов JavaScript и незаконно в JSON - различие, которое стоило мне больше часов, чем я хочу сложить. Более глубокое погружение: Как отформатировать JSON онлайн, йо-

Преобразователь Base64 - для JWT и URI данных

JWT — это три сегмента Base64Url, разделенные точками. Вставьте средний в Конвертер Base64 и вы можете прочитать претензии - эмитент, срок действия, объем - не отправляя токен в сторонний декодер. (Я использую JWT декодер когда я хочу, чтобы все три сегмента были проанализированы одновременно, но я все равно тянусь к необработанной Base64, когда полезная нагрузка выглядит странно, и я хочу видеть байты.) The Юникод попался, и почему btoa() бросает на смайлик, находится в Руководство по кодированию Base64, йо-

Преобразователь временных меток - криминалистика журналов

1752278400, йо- Это вчера или 2029? выше Конвертер времени отметки времени поворачивает Unix секунды, миллисекунды и ИСО 8601 во что-то, о чем может рассуждать человек, в часовом поясе, который вам дорог. Две трети моего отладки инцидента - это выстраивание временных меток из трех служб, каждая из которых вышла в систему в разном формате, и одна из них находится в UTC, а остальные - в 't.

Валидатор ЯМЛ - потому что отступ несущий

Kubernetes манифесты, действия GitHub, Docker-Compose. YAML имеет значение пробелов и будет бесшумно переосмысливать ваши намерения, а не ошибаться. выше Валидатор YAML Поймает TAB-VS-пространство и нецитируемое no Этот YAML 1.1 услужливо анализирует как логическое значение false, йо- (Да, правда. Проблема Норвегия реальна: код страны NO становиться false если не процитировать)

JSON Diff - что на самом деле изменилось?

Два ответа API, один рабочий, а другой нет. Глядя на них бок о бок в текстовом редакторе, — это проигрышная игра. JSON диф Показывает три клавиши, которые отличаются, и игнорирует 200, которые не работают.

Остальная часть отладочной полки

• Форматтер SQL- для запроса из 90 строк с четырьмя соединениями, который кто-то написал в одной строке.
• хэш-генератор- MD5/SHA-1/SHA-256/SHA-512, в основном для проверки загрузки или ключа кэша.
• синтаксический анализатор- потому что 0 */2 * * * а */2 * * * * отличаются одним символом и примерно в шестьдесят раз нагрузкой.
• несерийный- PHP serialize() Выход из wp_options ряд Если вы когда-либо отлаживали сохраненные настройки плагина WordPress, вы точно знаете, почему это существует.

Что я использую, когда пишу код, а не отлаживая его?

регулярные выражения, без догадок

Я пишу регулярное выражение в Тестер регулярного выражения прежде чем он когда-либо коснется кодовой базы. Вставьте реалистичный образец, напишите узор, посмотрите, как совпадет подсветка. выше регулярный конструктор это другая половина этого - it's, когда вы знаете, чего хотите, на английском языке и can't помните, было ли это's \b или \B, йо- Полная шпаргалка, а также ловушка с катастрофическим возвратом, которая может заморозить сервер с одним вложенным квантификатором, находится в Руководство по строительству регулярных выражений, йо-

UUID для посева

Двадцать тестовых строк, двадцать уникальных идентификаторов, прямо сейчас. Генератор UUID делает v1, v4 и v7 оптом. Используйте v7 для новых первичных ключей - it's упорядочен по времени, поэтому ваш индекс B-дерева 't измельчается случайными вставками. Я узнал, что дорогой способ и записал его в Руководство по генератору UUID, йо-

Кодирование, оба вкуса

кодировщик URL Для строк запроса, которые содержат & а = И пространство. HTML-объект На данный момент вам нужно отобразить <script> на странице как текст, а не как отчет об инциденте. Эти двое скучны, и я постоянно ими пользуюсь.

Форматировать спор

Данные приходят примерно всегда в неправильной форме. Набор преобразования покрывает движения, которые я на самом деле делаю:

• json в CSV- когда заинтересованная сторона запрашивает & quot;данные & quot; и означает электронную таблицу. Вложенные объекты сплющиваются в столбцы с точечными обозначениями. Подробности в json в CSV-руководство, йо-
• CSV в JSON- наоборот, для посева.
• json в yaml- для превращения блоба конфигурации во что-то, что человек будет редактировать.
• XML в JSON- каждая устаревшая интеграция SOAP навсегда.
• бинарный переводчик- текст ↔ двоичный/шестнадцатеричный/десятичный/восьмеричный. В основном для обучения и для байта нечетного протокола.

Вся полка кодирования, с которой кроется каждый, находится в Руководство по инструментам кодирования, йо-

Какие из них я использую для текста и контента?

Я много пишу - плагины, журналы изменений, этот блог. Это инструменты между черновиком и публикацией.

• счетчик слов- слова, символы, время чтения. Также самый быстрый способ сверить метаописание с бюджетом в 160 символов, прежде чем Google усечет его. Подробнее в Руководство по счетчику слов, йо-
• конвертер- CamelCase, snake_case, kebab-case, PascalCase. Я переименовываю переменные в больших количествах так чаще, чем использую свой редактор и инструмент-рефактор #39;s, что слегка смущает, но верно. Руководство по конвертору корпуса, йо-
• генератор пуль- заголовок URL-адреса, с диакритическими знаками, обработанными правильно. Café Décor должен стать cafe-decor, не caf-dcor, йо-
• текст разница- два файла конфигурации или две версии абзаца, расположенные рядом.
• Лорем Ипсум- копия-заполнитель макета, который еще не имеет содержимого.
• струна реверс- ниша, но она появляется при подготовке к собеседованию и при проверках палиндрома больше, чем вы 'думаю.

Полный набор текста описан в Руководство по текстовым инструментам, йо-

А как насчет дизайна и работы с интерфейсом?

Я разработчик, который должен сделать все приемлемым, а не дизайнер. Это конкретная работа, и эти трое делают ее.

• палитра- HEX ↔ RGB ↔ HSL, с проверкой контрастности, поэтому вы отправляете текст тела 't. HSL - это формат, который делает состояния наведения на действие вычитанием, а не предположением. Полная обработка: Цветосбор и руководство конвертера, йо-
• градиент генератора- линейный, радиальный, конический, с предварительным просмотром в реальном времени и копируемым CSS. Запись conic-gradient() Слепой — это особый вид страдания. CSS градиент генератора, йо-
• CSS-минификатор а HTML-минификатор- на данный момент вам нужно что-то вставить в a <style> метку и хотите, чтобы он был маленьким.
• Генератор метатегов- название, описание, открытый график, карты Twitter, и JSON-LD за один проход. я построил это, потому что я писал от руки те же четырнадцать тегов на каждом проекте.

Что я использую для файлов - изображений, PDF-файлов, всего остального?

Все инструменты изображения проходят через API холста API браузера, что означает, что 4 МБ PNG никогда не покидает вашу машину. Это не маркетинг, это то, что происходит, когда обработка <canvas> И не почтовый запрос.

• Изображение компресс- качественный ползунок, считывание живого размера. Большинство скриншотов Я отправляю падение 70 (85%) без видимой разницы. Смотрите Руководство по сжатию изображений, йо-
• Изменение размера изображения- точные размеры или процент, соотношение сторон заблокировано.
• конвертер формата- PNG/JPEG/WebP/AVIF. WebP - это отправка по умолчанию.
• Фоновое средство для удаления- запускает модель сегментации в браузере. It's - единственный инструмент, при котором я замечаю первую нагрузку.
• QR генератор- URL-адреса, учетные данные Wi-Fi, vCards. Я написал для этого кодер ISO/IEC 18004 вручную, исправление ошибок и все такое, что было либо отличным использованием выходных, либо ужасным.
• генератор паролей- использует crypto.getRandomValues(), не Math.random(), йо- Это различие имеет большее значение, чем ползунок длины.

И несколько разногласий, которые я построил, потому что они мне нужны были один раз, а потом в них все нуждались: единица измерения, калькулятор процента, разница в дате, Текст на почерк, йо-

Более широкий набор изображений находится в Руководство по инструментам изображения, а PDF-файлы получают собственное лечение в Руководство по инструментам PDF, йо-

Как они связаны в реальной работе?

Индивидуально каждый инструмент экономит минуту. Компаундирование происходит, когда вы их цепляете. Вот актуальная последовательность недели назад, отладка интеграцией, которая периодически возвращала 401 с:

1. Скопируйте неисправный запрос. Authorization заголовок. Разделите по точкам, вставьте второй сегмент в Конвертер Base64, йо- гласить exp, йо-
2. exp является временной меткой unix. в Конвертер времени отметки времени, йо- Срок действия истек за 41 секунду до срабатывания запроса.
3. Это проблема с наклоном часов, а не проблема с аутом. Проверьте CON обновления с помощью синтаксический анализатор- каждые 60 минут он обновлял жетон с помощью 60-минутного TTL. Без разницы. Состояние гонки.
4. Смените крон на 50 минут. готово

Четыре инструмента, может быть, три минуты, и ответом было изменение одного символа на выражение cron. Альтернативой - добавление регистрации, перераспределение, ожидание его повторения - было полдня.

Другая цепочка, которую я постоянно запускаю, — это контент: проект → счетчик слов → генератор пуль → Изображение компресс Для изображения заголовка → Генератор метатегов → Опубликовать.

Почему «клиентская» на самом деле имеет значение?

Из-за истории с символом stagring в верхней части этого поста, в основном. Но позвольте мне быть точнее в отношении утверждения, а не ручного, поскольку «приватность-первое» — это фраза, которая истощена всяческим смыслом.

Когда инструмент находится на стороне клиента, файл или строка, которую вы вставляете, обрабатываются JavaScript, работающим на вашей вкладке. Он переходит в переменную в памяти вашего браузера и возвращается в результате. нет fetch(), нет FormData, без загрузки. Вы можете проверить это самостоятельно примерно через десять: откройте DevTools, перейдите на вкладку Сеть, вставьте что-нибудь в любой инструмент на Toolz.dev и посмотрите, что ничего не происходит. Вот и все доказательство. Если запрос сети срабатывает при нажатии "Конвертировать", Ваши данные находятся на чьем-то сервере.

Что это покупает конкретно:

• Вы можете вставлять секреты. Постановочные токены, внутренние ответы API, клиент CSV клиента. Никуда не денется.
• это быстро. Нет поездки туда и обратно. a 5 МБ форматов JSON за время, необходимое для его анализа браузером.
• Без потолка размером файла За пределами собственного барана.
• Без ограничения ставки, Потому что нет сервера, чтобы ограничить вас.

Компромисс реальный, и я назову его: тяжелая работа (видео на 200 МБ, OCR более 500 страниц) действительно медленнее в браузере, чем на сервере с графическим процессором. Клиентская сторона является правильным по умолчанию, а не универсальным ответом.

Часто задаваемые вопросы

Являются ли эти инструменты повышения производительности разработчиков бесплатными?

Да - нет учетной записи, нет ограничения использования, нет пробного срока, который истекает Инструменты работают на вашей машине, а это означает, что они фактически ничего не стоят мне за использование, а это означает, что там 's нечего измерить.

Нужна ли мне учетная запись для их использования?

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

Безопасно ли вставлять конфиденциальные данные, такие как ключи API или токены?

Для инструментов на стороне клиента да - и вы можете подтвердить это, а не доверять мне. Откройте вкладку DevTools Network в своем браузере и #39;s. Вставить и следить за исходящими запросами. Есть 't любой. Единственное, чего I'd по-прежнему избегает где угодно, в том числе и здесь, - это вставка a производство секрет вы можете 't вращать - не из-за инструмента, а потому, что буферы обмена, общие ресурсы экрана и расширения браузера - все это реальные поверхности атаки.

Эти инструменты работают в автономном режиме?

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

Как они соотносятся с инструментами CLI, такими как JQ или OpenSSL?

Разные работы. CLI выигрывает за все, что написано, повторяется или в CI - это & #39;s компонуется и воспроизводится. инструменты браузера выигрывают для разовых задач, все, что выигрывает от визуального предварительного просмотра (регекс, градиенты, цвета, качество изображения), и машины, где вы можете & #39;t установить программное обеспечение. я использую и ежедневно и don & #39;t думать это & #39;s конкурс.

Какие инструменты я должен закладывать в первую очередь?

Если вы пишете код: форматтер JSON, конвертер времени, регулярный тестер, преобразователь Base64. Если вы пишете содержимое: счетчик слов, генератор слагов, сжатие изображений. Если вы делаете Frontend: Color Picker, Greatment Generator, Meta Tag Generator Закладка их в виде папки и щелкнув посередине, чтобы открыть их все сразу.

Инструменты работают на мобильном?

Они 'отзывчивы и они функционируют, но I'будет честен - я разработал их для клавиатуры и широкого окна просмотра. задачи вставки и копирования в телефоне хороши. все, что связано с цветовым спектром или образцом регекса, будет дракой.

Есть ли API для этих инструментов?

Не в настоящее время. все по замыслу клиент, что в корне противоречит API на стороне сервера. Для программного использования все базовые операции находятся на расстоянии одного вызова библиотеки на любом языке, на котором вы и #39; уже пишете - json_encode, base64_decode, preg_match, и так далее.

Какие бесплатные онлайн-инструменты для разработчиков?

Это зависит от вашей работы, но сплошное ядро охватывает форматирование и проверку (форматтер JSON, конвертер Base64), время и текст (преобразователь времени, счетчик слов, генератор слагов), работа с шаблоном (тестер регулярных выражений) и носитель (сжатие изображения, паликер цветов). Toolz.dev хранит более 600+ из них в одном месте, все бесплатно и на стороне клиента. Лучшим инструментом обычно является тот, который уже открыт на вкладке, когда вы нажимаете на трение.

Могу ли я использовать эти инструменты разработчика, ничего не устанавливая?

Да - нечего устанавливать и нет расширения, чтобы добавить.Каждый инструмент является веб-страницей, которая запускает свою логику в вашем браузере, поэтому вы открываете URL и начинаете работать на любой операционной системе. как только страница загрузилась, она продолжает работать, даже если ваше соединение падает.

короткая версия

Производительность разработчика — это не одна большая разблокировка. Это удаление сотни небольших трений: полезная нагрузка, которую вы не можете прочитать, метку времени, которую вы не можете разобрать, регулярное выражение, на которое вы догадываетесь, скриншот, который составляет 4 МБ, когда он должен составлять 400 КБ. Ни один из них не стоит сообщения в блоге. В совокупности они составляют большую часть разницы между днем, когда вы что-то отправляли, и днем, когда вы были заняты.

Здесь все в Toolz.dev, бесплатно, в вашем браузере, с вашими данными, остающимися на вашем компьютере. Начните с Форматтер JSON- если вы возьмете из этого поста только одну вкладку, то 's тот, который окупается к обеду.