Перевод статьи " Отключение моего значка: как и почему "
Привет Хабр! Недавно в еженедельном сборнике я увидел эту статью на английском языке и решил ее перевести, потому что она мне показалась весьма интересной.
Далее идет перевод. И так начнем: фавикона на моем сайте нет и скорее всего никогда не будет. Невозможно с полной уверенностью сказать, почему я пришел к такому решению, но с учетом того, что логотипа у меня нет – а я очень не хочу его иметь – создание иконки для сайта показалось мне излишним.
Но есть проблема: вы не можете просто оставить значок не установленным, поскольку большинство веб-браузеров все равно попытаются его запросить.
А это в свою очередь означает, что при каждой загрузке страницы будет повторный запрос файла favicon.ico, который будет определен как Not Found. Не знаю, как вас, а меня это раздражает. Так что нам делать? Самый простой способ решить эту проблему — сделать прозрачный фавикон, но мою проблему это не решает, так как я хочу избавиться от лишнего запроса, а не просто получить успешный ответ при его совершении.
Первая попытка
Хотя отсутствие тега значка не дает желаемого результата, я решил поэкспериментировать со значениями, которые он выдает. Моя первая попытка заключалась в использовании простого хеша: <link rel="shortcut icon" href="#" />
В целом, хотя это и помогло устранить ответ 404 Not Found в запросе, затем я столкнулся с другой проблемой, когда вся страница повторно запрашивалась.
Это связано с тем, что # в конечном итоге интерпретируется браузером как https://flower.codes/# , а также практически любой другой символ, с которым вы можете поэкспериментировать (пробелы, вопросительные знаки и т. д.).
Результат этого решения: не подходит.
Вторая попытка
Итак, мы не можем просто пропустить фавиконку и не можем использовать произвольный символ.Что же нам тогда делать? После некоторых поисков я наткнулся на концепцию, с которой большинство веб-разработчиков хорошо знакомы: URL-адреса данных.
Для непосвященных: URI данных позволяют встраивать файлы непосредственно в HTML, а не делать внешний запрос.
Чтобы максимально упростить его, они обычно состоят из определения типа загружаемого файла (например, text/html или text/plain) и содержимого файла.
Это означает, что вместо загрузки внешнего файла вы можете включить его в такую строку: data:text/html,<script>alert('hi');</script>
Однако для наших целей мы можем определить URL-адрес данных, который будет фактически пустым, просто опустив тип контента и сам контент: <link rel="shortcut icon" href="data:," />
Результат этого решения: подходит. Хорошо, но.
Почему? Как и ожидалось, это решило мою проблему.
Включив содержимое напрямую и оставив его пустым, мы можем устранить дублирующийся запрос, не вызывая ошибок в консоли.
Но зачем мне все эти проблемы? Хотите верьте, хотите нет, но мне действительно нравятся значки.
Я думаю, что они значительно упрощают организацию вкладок и закладок.
Но во всемирной паутине, плотно заполненной ими, отказ от одного на моем собственном сайте казался небольшим способом выделиться (и приложить все усилия, чтобы сделать это «правильным» способом, — это просто вишенка на торте).
Если кому интересно, я проведу интерфейс телеграмм-канала где я публикую интересные статьи на различные темы, а также периодически пишу короткие ридики, которые могут быть вам полезны.
Теги: #Разработка сайта #JavaScript #URL данных #Удаление значка
-
Инфографика: Наука В «Интерстелларе»
19 Oct, 24 -
Друзья, Нужна Помощь С Тестированием.
19 Oct, 24 -
Х.к.
19 Oct, 24