Скрипт для умного обновления страницы при верстке в PHPStorm
 

Скрипт для умного обновления страницы при верстке в PHPStorm

23 Январь 2014 9:11 Категории: Программирование

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

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

Обычный порядок верстки в PHPStorm:

  1. Внесение изменений в css или html файлы.
  2. Разворачивание окна браузера сочетанием клавиш Alt + Tab
  3. Обновление страницы для просмотра изменений

И мне безумно надоедает обновлять страницу каждый 5 секунд, именно поэтому я решил автоматизировать этот процесс.

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

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

Данный скрипт использует библиотеку JQuery, поэтому необходимо ее подключить в начале страницы.

Ловится фокус окна, т.е. разворачивание браузера и далее делается перезагрузка страницы через 0,2 секунды. Почему обновление только через 0,2 секунды, а не сразу? Просто PHPStorm, который делает автоматическое сохранение всех изменений, за этот промежуток времени сохраняет всё. Если уменьшить этот интервал, то страница будет обновляться не успев сохраниться, и вы не будете видеть изменения.

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

P.S. есть расширение для Chrome от  PHPStorm для обновления страницы, но как я понял, для этого необходимо разворачивать локальный сервер.