TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

10 советов для разработчиков, использующих Safari на Mac

221

Apple утверждает, что Safari является самым быстрым браузером и помогает продлить время автономной работы по сравнению с Chrome и Firefox. Хотя производительность Safari со временем снижается, это определенно лучший браузер на Mac. Специально для разработчиков есть множество скрытых функций, позволяющих более эффективно использовать Safari. В этой статье мы рассмотрим 10 советов для разработчиков, использующих Safari на Mac.

1 Включить меню разработки

По умолчанию меню разработчика в Safari отключено, и, следовательно, вы не сможете просматривать исходный CSS или HTML веб-страницы. Перейдите в «Safari> Настройки…» и включите параметр на вкладке «Дополнительно», чтобы добавить меню «Разработка» в строку меню по умолчанию.

10 советов для разработчиков, использующих Safari на Mac

Показать меню разработки в Safari

2 Просмотр полного URL-адреса в адресной строке и строке состояния

Иногда просмотр доменного имени в адресной строке может сводить вас с ума. Включите опцию на вкладке «Дополнительно» в настройках Safari, чтобы просмотреть полный URL-адрес сайта.

Точно так же, если вы привыкли смотреть на левую нижнюю часть строки состояния при наведении курсора на ссылки, вы можете включить отображение ссылок в меню «Вид> Показать строку состояния».

3 Просмотр исходного кода страницы

После того, как меню «Разработка» включено, щелчок правой кнопкой мыши на странице покажет вам дополнительные параметры для просмотра исходного кода страницы и параметры «Проверить элемент». Выбор любого из вариантов откроет консоль веб-инспектора Safari, показывающую ресурсы, используемые на странице.

10 советов для разработчиков, использующих Safari на Mac

Параметры правой кнопки мыши в Safari

Подробнее о просмотре исходного кода страницы с помощью Safari.

4 Очистить и отключить кеши

Хотя кеши помогают быстрее загружать страницу обычным пользователям, это одна из самых больших проблем для разработчика. Особенно, когда вы вошли на какой-либо сайт, невозможно очистить кеши с помощью опции очистки истории, так как это приведет к выходу с сайта. Самый простой способ – использовать пустые или отключить кеши, доступные в меню «Разработка».

10 советов для разработчиков, использующих Safari на Mac

Меню разработки Safari

5 Включение адаптивного режима

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

10 советов для разработчиков, использующих Safari на Mac

Адаптивный режим Safari

Ниже приведены параметры, которые можно использовать в адаптивном режиме:

  • Войдите или выйдите из адаптивного режима с помощью сочетаний клавиш «Option + Command + R», когда включено меню «Разработка».
  • Выберите устройство и коэффициент масштабирования для изображений сетчатки, чтобы увидеть, как страница выглядит на разных устройствах.
  • Вы можете перетащить размер страницы, чтобы просмотреть его по мере необходимости.
  • По умолчанию портретный и альбомный режимы просмотра всех устройств Apple доступны для просмотра того, как страница будет выглядеть на iPhone, iPad и Mac.
  • Вы также можете выбрать пользовательские агенты для браузеров Chrome, Firefox, IE и Edge, чтобы увидеть, как страница выглядит на платформах Windows, OS X и iOS. Пользовательские агенты также можно изменить с помощью пункта меню «Разработка> Пользовательский агент».

6 Редактор фрагментов

Редактор фрагментов – это средство предварительного просмотра кода, доступное в меню «Разработка». Это помогает проверить коды CSS, JavaScript и HTML на странице как песочнице, не открывая другую страницу.

10 советов для разработчиков, использующих Safari на Mac

Редактор фрагментов Safari

7 Отключить изображения, стили и JavaScript

Легко отключить или включить изображения на веб-странице, CSS и JavaScript, используя один щелчок в меню «Разработка». Это помогает разработчику просматривать страницу без изображений, CSS и скриптов, чтобы проверить время загрузки и устранить другие проблемы.

8 Запись на временной шкале

Поскольку скорость загрузки страницы более важна, легко записывать действия на странице с помощью параметра «Начать запись временной шкалы» в меню «Разработка». Вы можете использовать запись для анализа входящих сетевых запросов HTTP, рендеринга макета и событий JavaScript.

10 советов для разработчиков, использующих Safari на Mac

Запись на временной шкале Safari

9 Отключить ограничения для разных источников и локальных файлов

Ограничение перекрестного происхождения (CORE) – это фундамент веб-дизайна, который не позволяет загружать файлы определенных типов, например шрифты, размещенные в другом домене. Отключив CORE, вы можете легко тестировать ресурсы, расположенные на любых других доменах.

Точно так же отключение параметра ограничения локальных файлов помогает отключить проверки безопасности, мешающие вашей локальной разработке.

10 Разрешить использование JavaScript из поля интеллектуального поиска

Включение этой опции в меню «Разработка» позволит вам запускать выражения JavaScript прямо из адресной строки Safari с синтаксисом «javascript: выражение».

Получите 10 советов по повышению продуктивности Safari для обычных пользователей.

Источник записи: www.webnots.com

Этот веб-сайт использует файлы cookie для улучшения вашего опыта. Мы предполагаем, что вы согласны с этим, но вы можете отказаться, если хотите. Принимаю Подробнее