Auto-prefix URL — smulkmena, kuri sutaupo minutes
cutty.dev atpažįja, kai įklijuoji adresą be https://, ir pats jį prideda. Skamba trivialiai. Praktikoje tai skirtumas tarp dviejų sekundžių ir mygtuko „bandyti dar kartą“ paspaudimo.
Įvedate į formą allegro.pl. Spustelėjate. Ir kas?
Dauguma sutrumpintųjų metu gaunate pranešimą apie klaidą. Kažkas panašaus į „tai nėra teisingas URL adresas“. Nes priekyje nėra https://. Tad grįžtate atgal, pridate protokolą, spustelėjate dar kartą ir tik tada turite savo trumpąją nuorodą.
cutty.dev to nedarodo. Jis tiesiog pats prideda https:// ir tęsia toliau, lyg nieko nebūtų.
Žinau, kaip tai skamba. Kaip funkcija, kuri vos uždęsno yra verta pastraipos, nekalbant apie visą įrašą. Tačiau vis tiek sėdžiu ir apie tai rašau, nes būtent šis smulkmena yra man mažas manifestas apie tai, kaip apskrittis aš galvoju apie URL auto-prefix įrankio kūrimą ir visus tuos kitus nematomus palengvinimus.
Dvi sekundės prieš dvidešimt
Suskaičiuokime. Tikrai, skaičiuokime skaičius, nes kitaip tai tik kalbos.
Pirmasis kelias: įklijuoji, turi nuorodą, užd닫i langą. Dvi sekundės. Galbūt trys.
Antrasis kelias: įklijuoji, klaida, skaitai pranešimą (viena ar dvi sekundės, kad suprastum, apie ką kalbama), pridėji protokolą, paspauski dar kartą, tik tada nuoroda. Penkiolios, dvidešimties sekundžių. Plius ta nedidelė sudirgimo akimirka, tas tylus „o, tikrai, protokolas“, kuris vienkartai nieko nekainuoja, bet narša.
O dabar padaugink tuo, kiek kartų per mėnesį įklijuoji kokį nors adresą. Man tai šimtai. Kam, kas profesionaliai valdo nuorodas — šimtai. Staiga ši „vos verta paminėjimo“ smulkmena susikaupia į minutes per mėnesį. Vienam asmeniui.
Tai būtent ta aritmetika, kurią dauguma žmonių praleidžia šalin, nes kiekvienas atviras atvejis atrodo per mažas, kad juo būtų rūzimasi.
Kas iš tikrųjų ten yra po apačia
Mechanizmas yra banalus ir aš to visai neslėpiu. Įklijuojate tekstą į lauką. Prieš tam, kad kas nors išsiųstų į serverį, JavaScript dalis patikrina, ar tai, ką įvedote, prasideda nuo kokio nors protokolo — http://, https://, ftp://, mailto:, bet ko. Jei nesimulaija, sistema priima, kad turite omenyje paprastą domeną, ir prideda https:// priekyje.
Praktikoje:
allegro.pltampahttps://allegro.plgithub.com/twoj-profil/projekttampahttps://github.com/twoj-profil/projektwww.gazeta.pltampahttps://www.gazeta.pl
O jei protokolas jau ten yra, net jei jis keistas, sistema jo nepakeičia. Palieka ir toliau tikrina, ką su tuo padaryti. http://example.com praeiną (leistina). ftp://example.com išmetama į šiukšlyną, nes priimame tik http ir https. O javascript:alert(1) išskrieja nedelsiant, nes tai ne adresas, o bandymas įsukti kažką baisaus (klasikinis XSS, ačiū, ne).
Kodėl aš tai turiu, o pusė rinkos – ne
Čia tampa įdomu, nes atsakymas yra šiek tiek juokingas.
Standartinis adreso patikrinimo naršyklėje būdas yra konstruktorius new URL(string). Ir šis konstruktorius yra griežtas. Be kompromisų. Jei nėra protokolo — išmeta klaidą. new URL("allegro.pl") tiesiog grąžina jums TypeError ir tiek.
Ir žinai ką? Tai yra teisinga elgsena. Didžiausiai daliai programėlių būtent to ir nori. Tačiau sautilinkimo formas, kurioje žmogus kopijuoja adresą iš naršyklės juostos arba iš kito žmogaus žinutės, ši griežtumas pralenkia pratinimą ir tampa kliūtimi. Staiga įrankis, kuris turi tau sutaupyti laiko, priverčia tave taisyti tai, ką jis pats puikiai supranta.
Šio išvengimas yra tiesiog keli eiliai:
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)
}
Penki eilutės. Keletas sekundžių mažesnė trintis, kasdien, kiekvienam, kuris įklijuoja adresus. Nuoširdžiai nežinau, kodėl tai nėra standartas visur. Įtariu, kad problema yra ta, jog „URL konstruktorius tiesiog taip veikia“ ir niekas nenorėjo to paliesti. Inercija, o ne bloga valia.
Maža digressija apie tai, ką reiškia „standartiniu būdeliu“
Nes altai istorija su new URL() yra puikus pavyzdys kažkam platesniam. Daugelis dalykų programinėje įrangoje laikomų kaip „taip daroma“, iš tikrųjų yra „taip gyslės dėl kokios nors bibliotekos numatytųjų nustatymų, kurių niekas neabejojo“. Konstruktoriaus strict mode nėra „cutty“ dizainerių ar konkurentų sprendimas — tai URL specifikacijos autorių sprendimas, priimtas visiškai kitame kontekste, visiškai kitiems naudojimui.
O tada visa rinka paveldės šį numatytąjį pasirinkimą ir vadina jį „standartu“. Man atrodo, kad geriausi produktai gimsta būtent tokiose vietose, kur kažkas sustojo ir pasiteiravo: palauk, ar ši elgsena tarnauja mano vartotojui, ar tik mano bibliotekai? Dažniausiai atsakymas yra: bibliotekai. Ir tada verta penkiomis eilutėmis grįžti į žmogaus pusę.
Šių smulkių yra daugiau, nei įprasta pamatyti
Auto-prefix yra tik vienas iš daugybės tokių elementų, kurių nerasite jokioje funkcijų sąraše. Nes jei būtų įrašyti į sąrašą, kiekvienas iš jų atrodytų juokingai mažas:
- tarpų nukirpimas prieš validaciją, kad atsitiktinis laukas įklijuoto adreso gale nesugadinėtų visko
- tvirtinimo (inkliuko) išsaugojimas, t. y.
#sectionadresujehttps://example.com/page#sectionnepradingsta sutrumpinus - užklausos parametrai (
?utm_source=test) praeina pilnai, niekas nekirpama pakeliui - domenai su polškais simboliais,
źdźbło.pl, automatiškai konvertuojami į punycode - polskie raidės savo galūnėje keičiamos į ASCII (
różowy-linktamparozowy-link) - pavojingos protokolės —
javascript:,data:,file:— atmetamos su konkrečia, suprantama žinute
(Vis dar planuojamas automatinis http:// pakeitimas į https://, kai tikslusis serveris palaiko šifravimą. Tai šiuo metu dar neveikia gyvai, todėl nepretęsiu.)
Kiekviena iš šių detalių kažkam sutaupo penkias, dešimt, trisdešimt sekundžių ir vieną kvėpstilį. Atskritai – nieko. Kartu tai skirtumas tarp „veikia OK“ ir „mėgstu tuo naudotis“.
Ką dar norėčiau papildyti
Lietuviškas Markdown:
Reikalų sąrašas ateičiai, nes apie tai galvojimas man tiesiog teikia malonumą:
- išmanus įdėjimas — aptikti adresą, paslėptą viduryje sakinio, ir ištraukti patį URL tarp žodžių
- masinis įdėjimas — adresų sąrašas, po vienas kiekvienoje eilutėje, ir iš kiekvieno iškart atskiras trumpasis nuoroda
- siūlomi galutiniai elementai — remiantis tikslingos puslapio pavadinimu, pasiūlyti tris prekės ženklo „slug“ pasirinkimui
- Open Graph peržiūra iškart įdėjus, dar prieš paspaudžiant „trumpinti“
Kiekvienas iš šių vėl yra „penkilių eilučių funkcija, kuri atrodo kaip nieko nesakanti“. O visi kartu? Tai būtent ta riba tarp įrankio, kuris yra gerai, ir tokio, kurį pasitelki kasdien be jokio mąstymo. Jei norite pamatyti, kaip tai veikia dabar, įklijuokite į cutty.dev bet ką be protokolo — allegro.pl, github.com, news.ycombinator.com — ir pamatysite, kad jis jums nekariauja jokių kliūčių.
Galiausiai, šiek tiek asmeniškai
Daug laiko manėte, kad produktai laimi dėl didelių funkcijų. To vienintelio įspūdingo dalyko, kurį galima parodyti skiltyje ir apie kurį žmonės rašys. Ir taip, kartais taip ir yra.
Kuo ilgiau kuriu „cutty“, tuo stipriau jaučiu, kad vartotojo lojalumas gimsta kitur — tais šimtais mikrosekundžių, kurių niekas sąmoningai nepastebi. Neatsimeni, kad įrankis pats pridėjo tau https://. Prisimeni tik bendrą įspūdį, kad „naudotis šiuo įrankiu yra kaip taip gerai“, „niekaip nedauginas“. Šis įspūdis neatsiranda iš niekur. Jis susideda iš daugybės penkiateilių sprendimų, kurių vieni patys sau neapgynėtų kaip „vertų laiko“.
Gal būtent tai ir yra meistriškumas. Ne tas vienas didelis judesys, o atsidavimas stoti už žmogų prie formos kartą po kartos — net jei tai užtinka vos dvi sekundės. O tu? Kas tave paskutiniu metu supykdė kokiame nors įrankyje taip smulkiai, kad net gėdytis prisipažinti? Nes paprastai būtent ten ir slypi geriausias darbas, kurį reikia atlikti.