RƏSƏDXANA

Həftə 4 · 07/23

AI kodunu oxumaq

5 dəqiqəlik oxu

Müqaviləni imzalamazdan əvvəl oxuyursan. Hüquqşünas yazıb, çox səliqəli görünür — amma imzanı sən atırsan və nəticəsi səninlə qalır.

AI kodu yazır, məsuliyyət səndə qalır. Oxumaq üçün siyahı lazımdır: məlumat haradan gəlir, kimə etibar edilir, uğursuzluqda nə olur, açılan nə bağlanır.

useEffect(() => {
  const id = setInterval(tick, 1000);   // opened
  // nothing closes it: every visit adds another timer
}, []);
Üç sətir, bir sual: açılan şey harada bağlanır? Cavab yoxdursa, tapıntı var.

Çox deyilən söz: İşləyirsə, oxumağa ehtiyac yoxdur.

Sətirlərin çoxunu artıq sən yazmırsan, ona görə əsas bacarıq oxumaq olur. Diff-i siyahı ilə oxu: məlumat haradan gəlir, kimə etibar edilir, uğursuzluqda nə olur, hansı yeni vəziyyət yarandı, nə silindi, hər şərh doğru deyirmi.

Əvvəl məlumatın yolunu oxu

Hər dəyəri daxil olduğu yerdən (sorğu, input, yaddaş) istifadə olunduğu yerə qədər izlə. Ciddi xətaların çoxu sintaksisdə yox, bu yoldadır.

Açılan hər şey bağlanmalıdır

Listener, timer, abunəlik, bağlantı. Effekt nə açırsa, cleanup onu bağlamalıdır — yoxsa hər mount-da biri də əlavə olunur.

AI belə yazır

useEffect(() => {
  const id = setInterval(tick, 1000);
}, []);

Sən bunu istə

useEffect(() => {
  const id = setInterval(tick, 1000);
  return () => clearInterval(id);
}, []);

Şərhlər iddiadır

Davranışı təsvir edən şərhi kodla yoxla. Yalançı şərh heç olmamasından pisdir: oxuyanı yoxlamamağa inandırır.

AI belə yazır

// the local id is replaced by the server id after login
// (makePortable() does this)   <- defined, never called

Diff oxuyanda soruş: Diff-ə bax və hər «açılan» şeyi axtar: listener, timer, abunəlik, bağlantı. Hər birinin bağlandığı sətri göstər.

Terminlər

code review
Dəyişikliyi birləşdirməzdən əvvəl şübhə ilə oxumaq.
side effect
Funksiyanın qaytardığı dəyərdən başqa etdiyi hər şey: yazmaq, göndərmək, dəyişmək.
resource leak
Açılıb bağlanmayan şey: listener, timer, abunəlik — yaddaş sızmasının adi səbəbi.
render loop
Komponentin hər render-də yeni obyekt yaradıb özünü yenidən render etdirməsi.
code smell
Hələ xəta deyil, amma xətanın yaxınlıqda olduğunu göstərən əlamət.

İndi sən yoxla

1Bu effektdə nə səhvdir?

useEffect(() => {
  window.addEventListener("resize", onResize);
}, []);

2Bu sətirdə nə risklidir?

const profile = useSyncExternalStore(subscribe, getSnapshot, () => ({ name: "", avatar: null }));

Hazır prompt

İngiliscədir, çünki terminlər ingiliscədir. Tərcümə etsən də terminləri saxla.

prompt
Review this diff as a sceptical senior engineer. Rank findings by severity.

Check: trust boundaries, where identity comes from, error paths,
new state and who owns it, N+1 queries, unnecessary re-renders,
leaked resources (listeners, timers, subscriptions), and comments
that don't match the code.

For each finding give a concrete failure scenario:
inputs or state -> what goes wrong. Skip style.

Öz kodunda

  1. 1Son beş commit-i götür.
  2. 2Hər diff-i əvvəl özün siyahı ilə oxu və tapdıqlarını yaz.
  3. 3Sonra AI review-unu işlət və nəticələri müqayisə et: sən nəyi tapdın, AI nəyi tapdı?

Bunu görəndə bitib: Ən azı bir şeyi AI-dan əvvəl tapmısan.

Daha dərinə

code review checklistuseEffect cleanup memory leakreferential equality Reactcode smells

Oxumaq üçün