Yapay zekayla geliştirdiğin uygulama neden yavaş hissettiriyor (ve buna ne yapmalı)

Yapay zekayla geliştirdiğin uygulama çalışıyor. Düğmeler olması gereken yere gidiyor, ekranlar hizalanıyor, veri kaydediliyor. Ama bir şey ters gibi. Sayfalar yüklenirken biraz fazla bekletiyor. Elli öğelik bir liste bir saniye takılıyor. “Kaydet”e tıklamak seni bekletiyor, sonra biraz daha bekletiyor, sonra acaba tekrar mı tıklasam diye düşündürüyor. Bozulan bir şey yok — sadece yavaş hissettiriyor.

Bir yapay zeka uygulama oluşturucu ile yayına geçen, teknik olmayan bir kurucuysan, bu en yaygın “neyin yanlış olduğunu bilmiyorum” anlarından biridir. İyi haber şu ki, yavaş olan yapay zekayla geliştirilmiş uygulamaların %80’i aynı bir avuç sebepten dolayı yavaştır. Hiçbiri veritabanlarının nasıl çalıştığını öğrenmeni gerektirmez. Hepsinin de yapay zeka oluşturucuna sade bir dille isteyebileceğin çözümleri vardır.

Bu yazı, kopya kâğıdı.

”Yavaş” neden genellikle dört şeydir

Kullanıcılar bir uygulamanın yavaş hissettirdiğini söylediğinde, neredeyse hiçbir zaman “sunucu güçsüz” demek istemezler. Şu dört şeyden birini kastederler:

İlk çizim yavaş — bir bağlantıya tıklarlar ve bir şey belirmeden önce iki saniye boş bir ekrana bakarlar.
Uzun bir liste ağır — kaydırma, filtreleme ya da “tüm projelerimi” yüklemek, Instagram’da kaydırmaktan daha uzun sürer.
Bir eylem ne olduğunu söylemeden çok uzun sürer — “kaydet” ya da “gönder”e tıklarlar ve gözle görülür bir tepki olmaz.
Veritabanına çok fazla soru soruluyor — birden fazla yerden veri gösteren sayfalar her parçayı ayrı ayrı çeker ve bekleme sürelerini üst üste yığar.

Hepsi bu. Baktığım neredeyse her yavaş, yapay zekayla geliştirilmiş uygulama, bu dört sebepten biri yüzünden yavaştır. İşte her birini nasıl tespit edeceğin ve bu konuda oluşturucundan ne istemen gerektiği.

Yavaşlık nedeni #1: ilk çizim

Nasıl göründüğü: uygulamana giden bir bağlantıya tıklarsın, URL çubuğu yüklenmeyi bitirir, ama sayfa bir şey belirmeden önce bir iki saniye beyaz kalır.

Genellikle neyin sebep olduğu: uygulama, sana bir şey göstermeden önce ihtiyaç duyabileceği her JavaScript parçasını yüklüyordur. Yapay zeka uygulama oluşturucular cömertçe paketleme eğilimindedir — bir şeyi kaçırmaktansa dahil etmek daha iyidir — ve sen ne kadar çok özellik eklersen o paket o kadar büyür.

Yapay zeka oluşturucundan ne isteyeceğin: “İlk sayfa yüklemesi yavaş hissettiriyor. Ana sayfanın tüm yönetici bölümünü indirmek zorunda kalmaması için JavaScript paketlerini rotaya göre bölebilir misin?” Ya da daha basitçe: “Ana sayfa dışındaki rotalar için tembel yükleme ekle.” Çoğu modern çerçeve bunu bir iki satır yapılandırmayla destekler. Yapay zeka bunu nasıl yapacağını biliyor — sadece istemen gerekiyor.

Hazır oradayken: “Açılış sayfasında optimize edebileceğimiz büyük görseller var mı?” 4 MB’lık bir kapak fotoğrafı, algılanan hızı herhangi bir kod sorunundan daha çok dibe çeker.

Yavaşlık nedeni #2: uzun liste

Nasıl göründüğü: bir listen var — projeler, kişiler, gönderiler, herhangi bir şey — ve kırk ya da elli öğeyi geçtiğinde, kaydırma takılır ya da filtreleme gözle görülür şekilde bekletir.

Genellikle neyin sebep olduğu: uygulama her bir öğeyi tek seferde sayfaya çiziyordur, göremediklerini bile. On öğeyle bu sorun değil. Beş yüzle, tarayıcı tıkanır.

Yapay zeka oluşturucundan ne isteyeceğin: “Çok öğe olduğunda projeler listesi yavaşlıyor. Sayfalama ekleyebilir miyiz, ya da listeyi sanallaştırıp yalnızca görünür satırların çizilmesini sağlayabilir miyiz?” Sayfalama (“sayfa başına 20 göster, ileri/geri düğmeleriyle”) en kolay çözümdür. Sanallaştırma (“yalnızca kullanıcı kaydırdıkça ekrandakini çiz”) daha akıcı hisseteltir ama biraz daha fazla iş ister. İkisi de uygun.

Listede arama ya da filtreleme de varsa: “Arama filtresi tarayıcıda değil de sunucuda gerçekleşebilir mi?” Sunucu tarafı filtreleme, tarayıcının tüm veri kümesini değil, yalnızca eşleşen satırları tutması demektir.

Yavaşlık nedeni #3: sessiz bekleme

Nasıl göründüğü: “kaydet” ya da “gönder” ya da “oluştur”a tıklarsın. Gözle görülür bir şey olmaz. İki saniye sonra ekran güncellenir ve aslında bunca zaman çalıştığını fark edersin.

Genellikle neyin sebep olduğu: uygulama gerçek bir iş yapıyordur — bir veritabanına kaydetmek, bir API’yi çağırmak — ama yapay zeka oluşturucu bir yüklenme durumu eklememiştir. Yani senin bakış açından, tıklama hiçbir şey yapmamıştır.

Bu aslında bir performans sorunu değildir. Algılanan bir performans sorunudur ve bunlar çoğu zaman gerçek olanlardan daha can yakıcıdır. Geri bildirimi olmayan 200 milisaniyelik bir eylem, dönen bir çark olan 2 saniyelik bir eylemden daha yavaş hissettirir, çünkü kullanıcının beyni karanlıktadır.

Yapay zeka oluşturucundan ne isteyeceğin: “Bir eylemi tetikleyen her düğmeye bir yüklenme durumu ekle. Çalışırken bir dönen çark ya da ‘Kaydediliyor…’ metni göster ve kullanıcıların çift tıklayamaması için düğmeyi devre dışı bırak.” Bu, herhangi bir uygulamadaki en yüksek getirili tek performans çözümüdür ve neredeyse hiçbir maliyeti yoktur.

Hazır oradayken: “Sonucun ne olacağını bildiğimiz eylemler için, arayüzü iyimser bir şekilde güncelleyebilir miyiz — değişikliği hemen göster ve sunucu reddederse geri al?” İyimser güncellemeler, telefonunun çekişi berbatken bile sosyal uygulamalardaki “beğen” düğmesinin anında hissetmesinin sebebidir.

Yavaşlık nedeni #4: konuşkan veritabanı

Nasıl göründüğü: her biri ekstra bilgiyle bir öğe listesi gösteren bir sayfa — her projedeki görev sayısıyla bir proje listesi gibi — düz bir listenin yükleneceğinden çok daha uzun sürer.

Genellikle neyin sebep olduğu: sayfa projeleri tek bir sorguda yükler, sonra her projenin görev sayısını ayrı bir sorguda yükler. On proje mi? On bir sorgu. Yüz proje mi? Yüz bir. Buna “N+1 sorgusu” denir ve yapay zekayla geliştirilen uygulamalarda en yaygın veritabanı performans hatasıdır, çünkü yapay zeka verimli çalışan kod için değil, anlaşılır okunan kod için en iyileştirme yapar.

Yapay zeka oluşturucundan ne isteyeceğin: “Bu sayfa öğe başına bir sorgu yapıyor. İlgili tüm veriyi tek bir sorguda çekebilir miyiz — bir join ya da bir aggregate?” İki kelimenin de ne anlama geldiğini bilmene gerek yok. Yapay zeka biliyor. Ona yavaş sayfayı gösterip “Bende bir N+1 sorunu var galiba” demek genellikle yeterlidir.

N+1 sorunlarını hiçbir araç olmadan tespit edebilirsin: sayfayı aç, ne kadar sürdüğünü say, sonra alttaki listeye on kat fazla öğe ekle. Sayfa şimdi on kat daha yavaşsa, bir N+1’in var. Yalnızca azıcık daha yavaşsa, yok.

Erken optimizasyon hakkında bir söz

Yeni geliştiricilerin düştüğü bir tuzak: kimse uygulamayı kullanmadan önce her sayfayı hızlı yapmaya çalışmak. Yapma.

Performans çalışmasının gerçek bir maliyeti vardır. Yalnızca yirmi satıra sahip olacak bir listeye sayfalama eklemek boşa harcanmış emektir. Günde iki kez yüklenen bir sayfayı optimize etmek boşa harcanmış emektir. Üç kullanıcılı bir kurum içi araç için paketleri bölmek boşa harcanmış emektir. Yavaş bir sayfayı düzeltmenin doğru zamanı, sayfayı, eylemi ve ondan rahatsız olan bir kişiyi adlandırabildiğin zamandır.

O yüzden önce onu normal şekilde geliştir. Yayınla. Nasıl kullanıldığını izle. Bir şey gerçek bir insana — sen dahil — yavaş hissettirdiğinde, belirtiyi yukarıdaki dört kategoriden birine eşle ve o belirli çözümü iste. Kullanıcılarının asla fark etmeyeceği altyapıya bir hafta harcamadan daha hızlı bir uygulamaya kavuşursun.

Yapay zeka oluşturucunla hız hakkında nasıl konuşulur

İşe yarayan bir örüntü: çözümü değil, belirtiyi anlat. Yapay zeka, neyin gerçekten yanlış olduğunu bildiği sürece, doğru çözümü seçmede beklediğinden çok daha iyidir.

Kopyalayabileceğin iyi talimatlar:

“Ayarlar sayfasını açtığımda, bir şey belirmeden önce bir saniyelik gecikme oluyor. İlk çizimi neyin engellediğini bulabilir miyiz?”
“Pano, daha az veri göstermesine rağmen ana sayfadan daha uzun sürede yükleniyor. Verisini nasıl çektiğine bakabilir miyiz?”
“Profil sayfasında ‘değişiklikleri kaydet’e tıkladığımda iki saniye boyunca hiçbir şey olmuyor. Bir yüklenme durumu ekle ve düğmenin çift tıklanamayacağından emin ol.”
“Bu listeyi 500 sahte öğeyle test et ve yavaşlamaların nerede olduğunu söyle.”

Sonuncusunun değeri yeterince bilinmiyor. Yapay zekadan test verisi üretmesini ve sayfayı kendisinin denemesini istemek, yapabileceğin en faydalı şeylerden biridir. Yavaş noktaları çoğu zaman kullanıcılarından önce bulur — ve aynı yanıtta çözümü önerir.

Yapay zekayla geliştirilen uygulamalarda hız sihir değildir. Sorununun dört kovadan hangisine düştüğünü bilmek ve doğru çözümü net kelimelerle istemekle ilgilidir. Bunu yap, “yavaş hissettiriyor” bir avuç küçük, hedefli değişiklikle “iyi hissettiriyor”a dönüşür — bir baştan yazma değil.