В последние месяцы все большее число веб-разработчиков перешли на Firefox, чему способствовал выпуск Firefox Quantum после того, как Mozilla повысила производительность до уровня Google Chrome.
Хотя Firefox по умолчанию предлагает удобные для разработчиков инструменты с инновационными функциями, такими как собственный инспектор CSS Grid, все же можно добавить в браузер более интересные функции через экосистему плагинов.
Имея это в виду, вот несколько надстроек, которые вы должны попробовать, если используете Firefox в качестве веб-разработчика.
1. Отчет о совместимости
помогает вам Отчет о совместимости Помогает выявлять потенциальные проблемы совместимости веб-браузера при разработке веб-сайтов или веб-приложений. На данный момент это работает только для CSS.
После установки расширения к инструментам разработчика будет добавлена новая панель «совместимости». Оттуда вы сможете увидеть, как тот или иной сайт работает в каждом из основных браузеров.
Версии браузеров без проблем с совместимостью окрашены в зеленый цвет, некоторые версии - в желтый, а некоторые - в красный. Вы можете выполнить поиск в определенных версиях браузера, чтобы узнать, какие именно правила CSS вызывают проблемы.
2. Облегченный JSON
Если вы часто работаете с JSON API, вам может показаться утомительным отображение данных JSON в браузере. Это связано с тем, что браузер по умолчанию неправильно форматирует его, что затрудняет чтение.
Работает JSON Лайт Он устраняет эту проблему путем форматирования ответов JSON и JSONP с правильным выделением синтаксиса и функцией отображения ошибок, которая полезна при изучении больших данных JSON.
Если вам не нужны все функции, предоставляемые JSON Lite, вы можете просто включить встроенную в Firefox программу просмотра JSON, набрав «about: config» в адресной строке, а затем выполнив поиск devtools.jsonview.enabled. Установите значение true, дважды щелкнув параметр, а затем загрузив любой файл JSON в браузер, чтобы увидеть результат.
3. Реагировать на инструменты разработчика
React - одна из самых популярных библиотек сегодня в экосистеме веб-разработки. Если вы разовьете Веб-приложения, использующие React Вы увидите большую ценность в использовании расширения браузера для отладки кода.
После его установки вы сможете сканировать код React на любом веб-сайте, который его использует. Значок расширения появится на панели инструментов вашего браузера, и вы также получите вкладку «Взаимодействие» вместе с другими панелями DevTools. Панель React позволит вам проверить дерево React, включая иерархию компонентов, свойства, состояние и многое другое.
Вы также можете установить Инструменты разработчика Vue.js و Redux DevИнструменты Если какая-либо из библиотек разработана.
4. Фонтанелло
Обеспечивает Fontanello Действительно быстрый способ найти шрифты на любом веб-сайте. С этим дополнением вам больше не нужно открывать инструменты разработчика, чтобы увидеть, какой шрифт использует веб-сайт. Fontanello отображает базовую типографику для текста в контекстном меню Firefox, вызываемом правой кнопкой мыши.
5. Wappalyzer
Вы когда-нибудь задумывались о методах создания ваших любимых веб-сайтов? может спасти тебя Wappalyzer Эта информация находится на расстоянии одного клика. Он может обнаруживать различные системы управления контентом, платформы электронной коммерции, веб-серверы, фреймворки JavaScript, программное обеспечение баз данных, инструменты аналитики и многое другое.
تغليف
Если вы хотите улучшить рабочий процесс разработки, вы не ошибетесь с любым из вышеперечисленных дополнений. Не забудьте поделиться своими любимыми клипами в разделе комментариев ниже.
