Auto-prefix URL — dakikalar kazandıran küçük bir ayrıntı

allegro.pl formuna yazıyorsunuz. Tıklıyorsunuz. Ve ne oldu?

Çoğu kısaltıcıda bu noktada bir hata mesajı alırsınız. "Bu geçerli bir URL değil" gibi bir şey. Çünkü başında https:// yok. Bu yüzden geri döner, protokolü ekler, tekrar tıklar ve ancak o zaman kısa bağlantınızı elde edersiniz.

cutty.dev bunu yapmaz. Sadece kendisi https:// ekler ve hiçbir şey olmamış gibi devam eder.

Nasıl duyulduğunu biliyorum. Bir bütün yazıdan bahsetmiyorum bile, bir paragrafı bile zor hak eden bir özellik gibi. Yine de oturup bunu yazıyorum, çünkü tam da bu küçük ayrıntı, URL auto-prefix aracını ve geri kalan tüm o görünmez kolaylıkları inşa etme konusundaki düşünce yapımın küçük bir manifestosu niteliğinde.

İki saniye ikiye karşı yirmi

Hesaplayalım. Gerçekten, rakamlarla, çünkü aksi takdirde bu sadece laf kalabalığı olur.

Birinci yol: yapıştırıyorsun, bağlantıyı alıyorsun, pencereyi kapatıyorsun. İki saniye. Belki üç.

İkinci yol: yapıştırıyorsun, hata alıyorsun, mesajı okuyorsun (ne olduğunu anlamak için bir iki saniye), protokolü ekliyorsun, tekrar tıklıyorsun ve ancak şimdi linke basıyorsun. On beş, yirmi saniye. Üstüne o küçük sinirlenme anı, tek başına bir şey maliyeti olmayan ama birikerek artan o sessiz "ah evet, protokol" hissi.

Şimdi bunu, bir adresi ayda kaç kez yapıştırdığınızla çarpın. Bende bu onlarca kez. Bağlantıları profesyonel olarak yöneten biri için ise yüzlerce. Aniden bu "devede kulak" denilebilecek ayrıntı, kişi başına aylık dakikalar halinde birikmeye başlıyor.

İşte tam olarak çoğu insanın göz ardı ettiği aritmetik; çünkü her bir tekil vaka, üzerinde durulmayacak kadar küçük görünüyor.

Aslında altta ne yatıyor

Mekanizma çok basit ve bunu hiç de gizlemiyorum. Metni alana yapıştırıyorsunuz. Herhangi bir şey sunucuya gönderilmeden önce, bir JavaScript parçası yazdığınız şeyin bir protokol ile başlayıp başlamadığını kontrol eder — http://, https://, ftp://, mailto:, her neyse. Eğer böyle başlamıyorsa, sistem normal bir alan adı kastettiğinizi varsayar ve başına https:// ekler.

Pratikte:

• allegro.pl şuna dönüşüyor: https://allegro.pl
• github.com/twoj-profil/projekt şuna: https://github.com/twoj-profil/projekt
• www.gazeta.pl şuna: https://www.gazeta.pl

Eğer protokol zaten oradaysa, tuhaf olsa bile, sistem onu üzerine yazmaz. Onu bırakır ve ne yapacağına bakmaya devam eder. http://example.com geçer (izin verilir). ftp://example.com çöpe gider, çünkü sadece http ve https kabul ediyoruz. Ve javascript:alert(1) anında dışarı atılır, çünkü bu bir adres değil, kötü niyetli bir şey enjekte etme girişimidir (klasik XSS, teşekkürler, hayır).

Neden bende var da piyasanın yarısında yok

Burada işler ilginçleşiyor, çünkü cevap biraz komik.

Tarayıcıda bir adresi doğrulamanın standart yolu new URL(string) yapıcı metodudur. Ve bu yapıcı metod katıdır. Tavizsizdir. Protokol yoksa — hata fırlatır. new URL("allegro.pl") size sadece TypeError döndürür ve biter.

Biliyor musun? Bu doğru bir davranıştır. Uygulamaların büyük çoğunluğu için tam olarak istediğiniz şey budur. Ancak bir bağlantı kısaltma formunda, bir insanın adresi tarayıcı çubuğundan veya birinin mesajından kopyaladığı durumda, bu katılık bir avantajdan bir engele dönüşür. Aniden, size zaman kazandırması gereken bir araç, aslında mükemmel şekilde anladığı bir şeyi düzeltmenizi ister hale gelir.

Bunu atlatmak kelimenin tam anlamıyla birkaç satırdır:

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)
}

Beş satır. Adresleri yapıştıran herkes için günde birkaç saniye daha az sürtünme. Dürüst olmak gerekirse, bunun neden her yerde standart olmadığını bilmiyorum. Tahminimce mesele "URL oluşturucunun sadece böyle çalışması" ve kimsenin buna dokunmak istememesi. Kötü niyet değil, atalet.

"Standart olarak" ne anlama geldiğine dair küçük bir yan not

new URL() ile ilgili bu hikaye, daha geniş bir durumun harika bir örneğidir. Yazılımda "işte böyle yapılır" olarak kabul edilen pek çok şey, aslında "kimsenin sorgulamadığı bir kütüphanenin varsayılan ayarlarından böyle çıktı" demektir. Yapıcı metodun (constructor) katı modu (strict mode), cutty tasarımcılarının veya rakiplerin bir kararı değildir — bu, URL spesifikasyonunun yazarlarının, tamamen farklı bir bağlamda ve tamamen farklı kullanım amaçları için aldığı bir karardır.

Ve sonra tüm piyasa bu varsayılan seçimi devralıyor ve ona "standart" diyor. En iyi ürünlerin tam da birinin durup şu soruyu sorduğu yerlerde doğduğuna dair bir izlenimim var: bir dakika, bu davranış kullanıcımın mı yararına yoksa sadece benim kütüphanemin mi? Çoğu zaman cevap şudur: kütüphanenin. Ve işte o zaman beş satırla insanın tarafına geçmeye değer.

Bu ayrıntılar göründüğünden daha fazla

Auto-prefix, özellik listelerinde bulamayacağınız pek çok öğeden sadece biridir. Çünkü eğer oraya yazılmış olsalardı, her biri tek başına komik derecede küçük görünürdü:

• doğrulama öncesinde boşlukların kırpılması, böylece yapıştırılan adresin sonundaki yanlışlıkla bırakılan bir boşluğun her şeyi bozmaması için
• çapa koruma, yani https://example.com/page#section içindeki #section kısmının kısaltma sonrası kaybolmaması
• sorgu parametrelerinin (?utm_source=test) eksiksiz olarak aktarılması, yolda hiçbir şeyin kesilmemesi
• Polonya karakterli alan adlarının, źdźbło.pl, otomatik olarak punycode'a dönüştürülmesi
• özel uzantıdaki Polonya harflerinin ASCII'ye dönüştürülmesi (różowy-link ifadesinin rozowy-link olması)
• tehlikeli protokollerin — javascript:, data:, file: — belirli ve anlaşılır bir mesajla reddedilmesi

(Hedef sunucu şifrelemeyi desteklediğinde http:// adresinin https:// adresine otomatik olarak yükseltilmesi hala planlanmaktadır. Bu özellik henüz canlıda çalışmıyor, bu yüzden iddia etmeyeceğim.)

Bu detayların her biri birine beş, on, otuz saniye ve bir iç çekiş kazandırıyor. Tek başlarına hiçbir şey değiller. Birlikte ise "tamam, çalışıyor" ile "bunu kullanmayı seviyorum" arasındaki farkı oluşturuyorlar.

Başka neler eklemek isterdim

Gelecek için istek listesi, çünkü bunu düşünmek bana sadece keyif veriyor:

• akıllı yapıştırma — cümle içine gizlenmiş adresi tespit et ve kelimelerin arasından sadece URL'yi çıkar
• toplu yapıştırma — her satırda bir adres olacak şekilde liste halinde yapıştır ve her biri için anında ayrı kısa bağlantılar oluştur
• önerilen son ekler — hedef sayfa başlığına dayanarak seçebileceğiniz üç markalı slug önerisi sunun
• yapıştırdıktan hemen sonra, henüz "kısalt" butonuna tıklamadan Open Graph önizlemesi

Bunların her biri yine "hiçbir şeye benzemeyen beş satırlık bir fonksiyon". Peki ya hepsi bir araya geldiğinde? İşte bu, iş gören bir araç ile her gün düşünmeden elinizin gittiği araç arasındaki o sınırdır. Bunun şu an nasıl çalıştığını görmek istiyorsanız, cutty.dev adresine protokol olmadan herhangi bir şeyi — allegro.pl, github.com, news.ycombinator.com — yapıştırın ve size hiçbir engel çıkarmadığını görün.

Son olarak, biraz kişisel olarak

Uzun süre ürünlerin büyük özelliklerle kazandığını düşündüm. Bir slaytta gösterilebilen ve insanların hakkında yazacağı o tek etkileyici şeyle. Ve evet, bazen durum böyle.

Ama cutty'yi ne kadar uzun süre inşa edersem, kullanıcı sadakatinin başka bir yerde doğduğunu o kadar güçlü hissediyorum — kimsenin bilinçli olarak fark etmediği o yüzlerce mikrosaniyede. Aracın kendisinin https:// eklediğini hatırlamıyorsun. Sadece "bir şekilde kullanımı iyi", "sinir bozucu değil" gibi genel bir izlenim hatırlıyorsun. Bu izlenim durup dururken oluşmaz. Tek başına kimsenin "zaman ayırmaya değer" diyerek savunmayacağı onlarca beş satırlık karardan oluşur.

Belki de zanaatkarlık tamdır. O tek bir büyük hamlede değil, form doldururken her seferinde insanın yanında durma inadındadır — sadece iki saniyelik bir şey olsa bile. Peki ya sen? Son zamanlarda bir araçta seni o kadar küçük bir şey sinirlendirdi ki itiraf etmeye utanıyorsun? Çünkü genellikle en iyi yapılacak iş tam orada yatar.