Я пытаюсь реализовать свой собственный скрипт хинтинга ссылок для браузера серфинга, и
Я сталкивался с заметными проблемами с производительностью на страницах с
огромное количество ссылок. Например, на подсказку уходит около 2 секунд
видимые ссылки на https://gunther.suckless.org/patches/ и 3 секунды на
https://en.wikipedia.org/wiki/Japan. Я думаю, проблема в том, что я
пытаясь найти все теги ссылки, используя querySelectorAll("a")
(или
getElementsByTagName("a")
- у меня почти такая же производительность у меня
случай), а затем фильтрует все эти теги через функцию, которая проверяет
находится ли ссылка в окне просмотра или нет (другими словами, поиск ссылки
процедура тратит большую часть времени на ссылки, которые не будут отображаться
в любом случае):
var all_elems = document.body.querySelectorAll("a");
for (var i = 0; i < all_elems.length; i++) {
if (isHintDisplay(all_elems[i])) {
hint_elems.push(all_elems[i]);
}
}
Я подумал, что, возможно, «ручные» итерации тегов ссылок, которые обрабатывают один тег за раз и останавливаются при обнаружении невидимых ссылок, были бы более оптимальным решением.
Я пытался реализовать эти итерации, используя querySelector("a")
/ parentElement
/ nextElementSibling
, но в итоге получился некрасивый и абсолютно ненадежный код ...
Есть ли другой способ найти предыдущие / следующие похожие теги без использования
querySelectorAll
/ getElementsByTagName
? Или эти проблемы с производительностью присущи самому Javascript, и мало что можно сделать для
улучшить ситуацию?
P.S. Предполагается, что обработанные теги не будут содержать идентификаторов и классов.
ДОБАВЛЕНО
Реализация isHintDisplay:
function isHintDisplay(elem) {
var pos = elem.getBoundingClientRect();
var viewHeight = Math.max(document.documentElement.clientHeight,
window.innerHeight);
return !(pos.bottom < 0 || pos.top - viewHeight >= 0);
}