Auto-prefix URL — drobnost, která ušetří minuty

Zadáváte do formuláře allegro.pl. Kliknete. A co?

V więksině zkracovačů dostanete v tuto chvíli chybovou hlášku. Něco jako „to není platná URL adresa“. Protože chybí https:// na začátku. Takže se vrátíte, dopíšete protokol, kliknete znovu a teprve teď máte svůj krátký odkaz.

cutty.dev to nedělá. Prostě si k tomu sám připojí https:// a pokračuje dál, jako by se vůbec nic nestalo.

Vím, jak to zní. Jako funkce, která si sotva zaslouží odstavec, natož celý příspěvek. A přesto tu sedím a píšu o tom, protože právě tato drobnost je pro mě malou manifestací toho, jak vůbec přemýšlím o budování nástroje auto-prefix URL a celé té zbytek těchto neviditelných vylepšení.

Dvě sekundy proti dvaceti

Spočítejme si to. Opravdu, na číslech, protože jinak je to jenom řeč.

První cesta: vložíš, máš odkaz, zavřeš okno. Dvě sekundy. Možná tři.

Druhá cesta: vložíš, chyba, přečteš hlášení (sekundu či dvě, abys pochopil, o co jde), dopíšeš protokol, klikneš znovu, až teď teprve odkaz. Patnáct, dvacet sekund. Plus ta malinká chvíle podráždění, to tiché „aha, protokol“, které jednotlivě nic nestojí, ale kumuluje se.

A nyní vynásobte tím, kolikrát za měsíc vkládáte nějakou adresu. U mě je to desítky. U někoho, kdo spravuje odkazy profesionálně — stovky. Najednou se tato „téměř nepodstatná“ drobnost ukládá do minut měsíčně. Na osobu.

To je právě ta aritmetika, kterou většina lidí přehlíží, protože každý jednotlivý případ se zdá být příliš malý na to, aby se o něj někdo staral.

Co tam vlastně sedí pod povrchem

Mechanismus je banální a vůbec to nezatajuji. Vložíte text do pole. Než cokoli odejde na server, kousek JavaScriptu kontroluje, zda to, co jste napsali, nezačíná nějakým protokolem — http://, https://, ftp://, mailto:, cokoliv. Pokud nezačíná, systém předpokládá, že máte na mysli běžnou doménu, a připojí https:// na začátek.

V praxi:

• allegro.pl se mění na https://allegro.pl
• github.com/twoj-profil/projekt na https://github.com/twoj-profil/projekt
• www.gazeta.pl na https://www.gazeta.pl

A pokud protokol již tam je, i kdyby byl divný, systém jej nepřepisuje. Ponechává jej a dále kontroluje, co s tím podniknout. http://example.com prochází (povoleno). ftp://example.com jde do koše, protože přijímáme pouze http a https. A javascript:alert(1) vyletí okamžitě, protože to není adresa, ale pokus o vstříknutí něčeho hnusného (klasický XSS, děkujeme, ne).

Proč to mám já, a polovina trhu ne

Tady to začíná být zajímavé, protože odpověď je trochu vtipná.

Standardní způsob validace adresy v prohlížeči je konstruktor new URL(string). A tento konstruktor je tvrdý. Kompromisní neexistuje. Chybí-li protokol — vyhodí chybu. new URL("allegro.pl") vám prostě vrátí TypeError a nic víc.

A víš co? To je správné chování. Pro obrovskou většinu aplikací je přesně to, co chceš. Ale u formuláře pro zkracování odkazů, kde člověk kopíruje adresu z adresního řádku prohlížeče nebo z něčí zprávy, se tato strohost mění ze výhody v překážku. Najednou nástroj, který ti má šetřit čas, nutí tě opravovat něco, čemu přece dokonale rozumí.

Obcházení tohoto je doslova několik řádků:

function sanitizeUrl(input) {
  const trimmed = input.trim();
  const hasProtocol = /^[a-z][a-z0-9+.-]*:/i.test(trimmed);
  const normalized = hasProtocol ? trimmed : "https://" + trimmed;
  // dalej leci normalna walidacja przez new URL(normalized)
}

Pět řádků. Několik sekund méně tření denně pro každého, kdo vkládá adresy. Upřímně nevím, proč to není všude standardem. Podezřívám, že jde o to, že „URL konstruktor to prostě takhle dělá“ a nikdo se do toho nechtěl dotknout. Inertie, ne zlý úmysl.

Malá digrese o tom, co znamená „standardně“

Proto ta historie s new URL() je skvělým příkladem něčeho širšího. Spousta věcí v softwaru, které se považují za „tak se to dělá“, je ve skutečnosti jen „tak to vyšlo z výchozích nastavení nějaké knihovny, kterou nikdo nezkoušel zpochybnit“. Strict mode konstruktoru není rozhodnutím návrhářů cutty ani konkurence — je to rozhodnutí autorů specifikace URL, učiněné v úplně jiném kontextu, pro úplně jiné účely.

A potom celý trh dědí tuto výchozí volbu a nazývá ji „standardem“. Mám pocit, že ty nejlepší produkty vznikají právě tam, kde se někdo zastavil a zeptal se: moment, slouží toto chování skutečně mému uživateli, nebo jen mé knihovně? Nejčastěji odpověď zní: knihovně. A právě tehdy stojí za to pěti řádky přejít na stranu člověka.

Těch drobných věcí je více, než je vidět

Auto-prefix je jen jedním z mnoha takových prvků, které nenajdete v žádném seznamu funkcí. Protože kdyby byly tam vypsány, každý zvlášť by vypadal směšně malý:

• ořezávání mezer před validací, aby náhodná mezera na konci vložené adresy vše nezničila
• zachování kotvy, tedy #section v https://example.com/page#section nezmizí po zkrácení
• parametry dotazu (?utm_source=test) procházejí v celku, nic se cestou neořízne
• domény s polskými znaky, źdźbło.pl, jsou automaticky převáděny na punycode
• polské znaky ve vlastním koncovce jsou nahrazovány ASCII (różowy-link se stává rozowy-link)
• nebezpečné protokoly — javascript:, data:, file: — jsou odmítány s konkrétní, srozumitelnou zprávou

(Je ještě plánováno automatické přepnutí http:// na https://, pokud cílový server podporuje šifrování. To bohužel ještě nefunguje live, takže se nebudu tvářit jinak.)

Každý z těchto detailů někomu ušetří pět, deset, třicet sekund a jedno vzdechnutí. Samotné nic. Dohromady je to rozdíl mezi „funguje OK“ a „rád to používám“.

Co bych ještě chtěl přidat

Seznam přání do budoucnosti, protože o tom přemýšlet mě prostě baví:

• inteligentní vkládání — detekovat adresu skrytou uvnitř věty a vytáhnout samotný URL mezi slovy
• hromadné vkládání — seznam adres, jedna na řádek, a z každé okamžitě samostatný krátký odkaz
• navrhované koncovky — na základě názvu cílové stránky navrhnout tři typické slugy k výběru
• náhled Open Graph ihned po vložení, ještě než kliknete na "zkrátit"

Každý z těchto je opět „pětilinková funkce, která vypadá jako nic“. A všechny dohromady? To je právě ta hranice mezi nástrojem, který je v pořádku, a takovým, po kterém saháte každý den bez přemýšlení. Pokud chcete vidět, jak to funguje nyní, vložte do cutty.dev cokoliv bez protokolu — allegro.pl, github.com, news.ycombinator.com — a uvidíte, že vám nic neklade překážky.

Na závěr, trochu osobně

Dlouho jsem si myslel, že produkty vyhrávají velkými funkcemi. Tím jedním efektním něčím, co lze ukázat na snímku a o kterém lidé budou psát. A ano, někdy tomu tak je.

Čím déle stavím cutty, tím silněji cítím, že loajalita uživatele vzniká jinde — v těch stovkách mikrosekund, kterých si nikdo vědomě nevšímá. Nepamatuješ si, že nástroj ti sám přidal https://. Pamatuješ si jen celkový dojem, že se to „nějak dobře používá“, že to „neštve“. Tento dojem nevzniká z ničeho. Skládá se z desítek pětipětřádkových rozhodnutí, která by nikdo jednotlivě neobránil jako „stojící za čas“.

Možná právě v tom spočívá řemeslo. Ne v tom jednom velkém pohybu, ale v vytrvalosti, abyste stále dokola stáli na straně člověka u formuláře — i kdyby šlo jen o ty ubohé dvě sekundy. A ty? Co tě v posledním období na nějakém nástroji naštvalo natolik drobného, že se za to až stydíš přiznat? Protože obvykle právě tam čeká ta nejlepší práce k udělání.