Linear neden bu kadar hızlı: teknik bir inceleme

Linear'da bir görevi güncellemek birkaç milisaniye sürerken, geleneksel bir CRUD uygulaması aynı işi yaklaşık 300 ms'de yapıyor. performance.dev'de yayımlanan teknik bir inceleme, bu hissin arkasındaki yöntemleri anlatıyor ve gizli bir "gümüş kurşun" olmadığını vurguluyor. Yazar, Linear'da hiç çalışmadığını ve kodunu görmediğini belirtiyor.

Tarayıcıdaki veritabanı

Çoğu web uygulaması aynı döngüde çalışır: kullanıcı tıklar, tarayıcı HTTP isteği gönderir, sunucu veritabanını sorgular ve arayüz birkaç yüz milisaniye boyunca bir spinner'ın arkasında bekler. Linear bunu tersine çeviriyor: arayüzün okuduğu veritabanı tarayıcıda, IndexedDB'de yaşıyor — değişiklikler önce yerel olarak uygulanıyor, sonra eşzamansız biçimde sunucuya gönderiliyor; sunucu da deltaları WebSocket üzerinden diğer istemcilere yayınlıyor.

Pratikte bir değişiklik iki satırdır: issue.title = "Faster app launch" bellekteki bir depoyu (MobX gözlemlenebilirleri) günceller, issue.save() ise senkronizasyon motorunun gruplayıp gönderdiği bir işlemi kuyruğa alır. Arayüz yerel durumdan eşzamanlı olarak yeniden çizilir, yani beklenecek bir şey yoktur. Linear'ın kurucu ortaklarından Tuomas, 2024'teki bir konferansta yazdığı "ilk kod satırlarının" tam da senkronizasyon motoru olduğunu söylemişti. Çoğu ekip özel bir motora ihtiyaç duymaz: TanStack Query veya SWR ile iyimser güncellemeler şaşırtıcı derecede yakın sonuç verir.

İlk yüklemenin anında hissedilmesi

Hız daha derleme aşamasında başlar. Linear derleme hattını dört kez yeniden yazdı — Parcel, Rollup, Vite, Rolldown — her seferinde daha az JavaScript ve CSS göndermek için. Şirketin verilerine göre: %50 daha az kod, sıkıştırma sonrası %30 daha küçük boyut, soğuk önbellekle sayfa yüklemede %10-30 hızlanma, Safari'de aktif görevler görünümünün ilk boyanma süresinde %59 düşüş ve bellek kullanımında %70-80 azalma. Bunun çoğu eski tarayıcı desteğinin bırakılmasından, daha iyi ölü kod temizliğinden ve agresif kod bölmeden geldi.

Buna rağmen Linear hâlâ yaklaşık 21 MB küçültülmüş JavaScript gönderiyor — talep üzerine yüklenen yüzlerce rota düzeyinde parçaya bölünmüş halde. İçe aktarma şelalesini önlemek için HTML'i modulepreload ipuçları bildiriyor; böylece tarayıcı tüm istekleri JavaScript çalışmadan önce paralel olarak gönderiyor.

Animasyon ve son ayrıntılar

Animasyon son katmandır. Linear'ın stil dosyasında süreler kısadır: hızlı geçişler için 0,1 sn, normal için 0,25, yavaş için 0,35 sn ve vurgu solması 0,15 sn — Material'ın 200 ms'inin ve iOS'un yaklaşık 350 ms'lik yayınının belirgin biçimde altında. Giriş ve çıkış asimetriktir: vurgular, açılır pencereler ve ajan paneli anında görünür, 150 ms'de söner. Hareket genellikle bir kaynağa işaret eder — örneğin durum penceresi, durum etiketinden dışarı doğru açılır.

Gümüş kurşun yok

İncelemenin sonucu şu: tek bir karar bir uygulamayı hızlı yapmaz. Linear'ın modeli şöyle: sunucu, gerçeğin kaynağı değil senkronizasyon hedefidir; veritabanı tarayıcıda yaşar; değişiklikler arka planda uzlaşır ve ilk yükleme daha az kodu daha çok parça halinde gönderir. Yazara göre zor olan uygulama değil, kod tabanı büyüyüp yeni kısıtlarla karşılaşırken yıllar boyunca zanaata bağlı kalmaktır.