scrolldog

Індикатори прокрутки — і чому свій варто зробити собакою

Кожна довга сторінка ставить те саме питання: скільки ще лишилося? Індикатор прогресу на нього відповідає, і більшість із них відповідають так, що ви перестаєте їх помічати вже з другого абзацу.

Для чого потрібна смуга прогресу

Смуга прокрутки сама собою, в теорії, вже показує, де ви перебуваєте. На практиці вона завширшки кілька пікселів, ховається, поки ви не поворухнете мишею, а на сторінці, що підвантажує зображення по ходу читання, її повзунок узагалі змінює розмір просто у вас на очах. Розширення повертають смугу прогресу назад саме тому, що власну відповідь браузера тихо звели нанівець.

У підсумку ви отримуєте тонку кольорову лінію поверх сторінки, яка заповнюється в міру прокрутки. Працює. Але це водночас і найпростіша річ на сторінці, яку перестаєш помічати: пряма лінія, що лежить у смузі, яку зір давно привчений ігнорувати, і яка ніколи нічого не робить, крім як довшає.

Позиція, а ще й швидкість

Смуга несе рівно одне число — наскільки далеко ви прогорнули. Є й друге число, доступне безкоштовно, і жодна смуга його не показує: з якою швидкістю ви рухаєтеся.

scrolldog несе обидва. Позиція улюбленця вздовж краю вікна — це глибина прокрутки. На початку сторінки він зліва; у кінці сторінки він добіг до іншого краю. Його хода — це швидкість прокрутки: різко крутнули колесо — він мчить, гортаєте неквапом, абзац за абзацем — він біжить підтюпцем.

Зупинилися — і він сідає. Оце смуга не вміє геть. Статична смуга виглядає однаково і коли ви уважно читаєте, і коли ви забули вкладку відкритою три години тому. Улюбленець, що сів, повідомляє вам, що сторінка стихла, і це не коштує вам жодної секунди уваги, бо ви й не читали його спеціально — ви помітили його краєм ока, а саме на таку увагу індикатор прогресу завжди й міг розраховувати.

Чого це коштує

Звичне заперечення проти декоративного розширення — що воно робить браузер гіршим. Це розширення пасивно слухає прокрутку, згортає кожну серію подій в один запис на кадр анімації і рухає єдиний елемент усередині фіксованої доріжки нульового розміру. Воно ніколи не читає й не змінює розмітку вашої сторінки і не надсилає жодного мережевого запиту зі сторінки, яку ви читаєте.

Один перемикач у спливному вікні вимикає його всюди, у всіх відкритих вкладках, одним рухом.

Подивитися, як це працює