prefetch prerender несколько страниц при наведении

У меня есть следующий код, который предварительно выбирает и отображает * конкретные ссылки при наведении курсора. Мой вопрос: нужно ли мне добавлять новую ссылку каждый раз или достаточно, чтобы я изменил href?

$(".prerender").on("mouseover", function() {
        var link = $(this).attr("href"),
            prerenderLink = $("#prerenderLink");
        if (prerenderLink.length) {
            if (prerenderLink.attr("href") === link) return;
            prerenderLink.attr("href", link);
        } else {
            $('<link id="prerenderLink" rel="prefetch prerender" href="' + link + '" />').appendTo("body");
        }
    });

Будет удаление, изменение href отменить предварительный рендеринг / предварительную выборку ранее определенного href или даже удалить его из кеша? Или, поскольку он был вызван, когда он остается в кеше?

Кроме того, где это можно проверить?

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

Источник

2 ответа

Решение

То, отменит ли href сетевой запрос, вероятно, зависит от браузера, и, вероятно, будет ли он удален из кэша, зависит от настроек браузера и пользователя.

Чтобы проверить это, откройте инструменты разработки с помощью F12, откройте вкладку сети и проверьте столбец состояния. Если это 304 (не изменено), оно пришло из кеша.

Источник

Chrome/IE/Edge позволяет предварительно визуализировать одну страницу на окно (обратите внимание, что это не вкладка), это означает, что подсказка о втором предварительном просмотре игнорируется. Следовательно, вы должны обновить атрибут href, чтобы сообщить браузеру, что нужно предварительно отобразить другую страницу. Когда атрибут href изменяется, Chrome отклоняет ранее отрендеренную страницу, похоже, что IE11 и Edge ведут себя одинаково, но это трудно проверить. Чтобы увидеть, что представлено в Chrome, вы можете посетить chrome://net-internals/#prerender, Обратите внимание, что когда инструмент разработчика открыт, Chrome/IE/Edge игнорирует предварительно обработанную страницу, они загрузят ее с нуля.

В общем, решение при наведении не самое лучшее. Как вы указали, ваш сервер получит дополнительную нагрузку, поэтому лучше добавить приличную уверенность, прежде чем добавлять подсказку prerender. Также браузеру нужно некоторое время для загрузки страницы. При наведении курсора браузер может не получить достаточно времени для предварительной визуализации.

Я также заинтересован в этой теме. Несколько месяцев назад я запустил проект с открытым исходным кодом ( https://github.com/sirko-io/engine), который отслеживает, как пользователи перемещаются по сайту, и добавляет тег ссылки для подсказки браузеру. Вы можете попробовать это на своем сайте, если хотите.

Источник
Другие вопросы по тегам