Yönetici Özet Dört hafta yarı zamanlı (muhtemelen toplam 80 saat) 40+ bileşen, bir yönlendirici ve yalnızca LLM oluşturulan kod kullanılarak etkileşimli bir web sitesi desteği ile tam bir reaktiv UI çerçevesi oluşturmak için harcadım. . LLMs can produce quality code—but like human developers, they need the right guidance Key Findings On Code Quality: İyi tanımlanmış görevler temiz bir ilk geçiş kodu verir Zayıf belirlenmiş veya benzersiz gereksinimler yumuşak uygulamalar üretir Code degrades over time without deliberate refactoring Güvenilirliği geliştirmek için istendiğinde LLM'ler savunmasızca over-engineer On The Development Process: Bir görev büyük olduğunda “iyi belirlenmiş” olmak zordur Genişletilmiş düşünme ("düşünme") daha iyi sonuçlar verir, ancak bazen çevre ya da aşırı genişletici mantıklara yol açar. Çeşitli LLM perspektifleri (dönüştürme modelleri) değerli mimari inceleme ve düzeltme yardımı sağlar Yapısal çerçeve kullanımı, örneğin Bau.js veya Lightview, kısıtlanmamış gelişimden daha iyi eğilimi önler Formal metrikler objektif olarak tanımlar ve kod karmaşıklığını ortadan kaldırır Sonuç: Birçok yönden LLM'ler onları eğitmiş olan insanların ortalaması gibi davranırlar - benzer hatalar yaparlar, ancak çok daha hızlı ve daha büyük ölçekte. meydan Dört hafta önce, geliştirme topluluğunda sıcak tartışılan bir soruyu yanıtlamaya karar verdim: LLM'ler maddi, üretim kalitesi kod oluşturabilir mi? Bir oyuncak uygulaması değil, basit bir CRUD uygulaması. Bir sürü önceden inşa edilmiş bileşenler, bir yönlendirici ve destekleyici bir web sitesi ile tam, modern bir reaktiv UI çerçeve: Tens of thousands of lines of JavaScript, CSS, and HTML Hafıza, Performans ve Güvenlik Düşünceleri Profesyonel UX ve geliştirici deneyimi İnşa etmeye karar verdim (Bölüm )—a reactive UI framework combining the best features of Bau.js, HTMX, and Juris.js. The constraint: 100% LLM-generated code using Anthropic's Claude (Opus 4.5, Sonnet 4.5) and Google's Gemini 3 Pro (Flash was not released when I started). Lightview Sıcaklık.dev Soru ile başlamak, kodla değil Claude Opus ile başlıyorum: “HTMX, Bau ve Juris’i bir araya getiren reaksiyonel bir UI kütüphanesi oluşturmak istiyorum. Hypermedia için özel atribüt isimleri tercih etmiyorum – sadece geliştirilmiş davranış. HTML’de çizgi sözlü işleme, bir SPA yönlendirici, otomatik özelleştirilmiş öğeler oluşturma ile bir UI bileşen kütüphanesi, ekstra çalışma olmadan SEO etkinleştirilmiş uygulamalar ve kullanıcıları tanıtmak ve eğitmek için bir web sitesi istiyorum. herhangi bir sorunuz var mı?” "I want to create a reactive UI library that combines HTMX, Bau, and Juris. For hypermedia, I prefer no special attribute names—just enhanced behavior. I also want string literal processing in HTML, an SPA router, a UI component library with automatic custom element creation, SEO-enabled apps with no extra work, and a website to promote and educate users. Do you have any questions?" Claude başlangıçta kod içine dalmadı. : dozens of clarifying questions TypeScript mi yoksa Vanilla JavaScript mi? Which UI component library for styling? (It provided options with pros/cons) HTMX özelliği hangisidir? Hosting tercih mi? Router stratejisi mi? Bununla birlikte, bazen, hazır olması gerektiğini düşündüğümden önce kod yazmaya başladı ve bir yanıtın iptal edilmesi ve yeniden yönlendirilmesi zorunda kaldım. Bulmaca: LLM'ler erken kod üretimine karşı güçlü bir önyargıya sahiptir. Henüz kodlama yapmamak için hatırlatıldığında bile, birkaç etkileşimden sonra unuturlar. Bu, tüm modellerde oluyor—Claude, Gemini, GPT. Örnek kod verildikten sonra, örneğin örnekler uygulama isteği yerine sorularla birlikte sağlandığında bile, üretim sürecini başlatmak için özellikle tetiklenmiş görünüyorlar. Bulmaca: LLM'ler erken kod üretimine karşı güçlü bir önyargıya sahiptir. Henüz kodlama yapmamak için hatırlatıldığında bile, birkaç etkileşimden sonra unuturlar. Bu, tüm modellerde oluyor—Claude, Gemini, GPT. Örnek kod verildikten sonra, örneğin örnekler uygulama isteği yerine sorularla birlikte sağlandığında bile, üretim sürecini başlatmak için özellikle tetiklenmiş görünüyorlar. Yöntem: Eğer bir LLM hazır olmadan önce kod üretmeye başlarsa, tamamlanmayı hemen iptal edin ve yönlendirin: "Hiç kod oluşturma. Daha fazla sorunuz var mı?" Eğer LLM "Unutuyor" ve kod üretme yönünde geri döndürüldüğünde bunu birden fazla kez tekrar etmeniz gerekebilir. Antigravity veya diğer IDE'lerde benzer modlarda Hızlı Mod Değişimi ile Planlama bu konuda yardımcı olmalıdır, ancak tekrar tekrar kullanmak rahatsız edici olacaktır. Daha iyi bir çözüm olacaktır: Eğer kullanıcı bir soru sorarsa, LLM, tartışma istemediklerini varsaymalıdır, kod değil. Sadece açıkça istendiğinde veya izin istedikten sonra kod oluşturun / değiştirin. Bir LLM, hazır olmadan önce kod üretmeye başlarsa, tamamlanmayı hemen iptal edin ve yönlendirin: "Kodu henüz oluşturma. Daha fazla sorunuz var mı?" LLM'nin "un unuttuğu" ve kod üretimine geri döndüğünde bunu birkaç kez tekrar etmeniz gerekebilir. Antigravity'deki Planlama vs. Hızlı Mod Değişimi veya diğer IDE'lerde benzer modlar bu konuda yardımcı olabilir, ancak tekrar tekrar kullanmak rahatsız edici. : Kullanıcı bir soru sorarsa, LLM, tartışma istemediklerini varsaymalıdır, kod değil. yalnızca açıkça istendiğinde veya izin istedikten sonra kod oluşturun / değiştirin. Guidance: A better solution would be Bir saat sonra, Claude nihayet şöyle dedi: “Daha fazla soru yok. birçok adım olacağından bir uygulama planı oluşturmak ister misiniz?” Sonuçlanan plan kapsamlıydı - kontrol kutuları, tasarım kararları ve göz önünde bulundurularak ayrıntılı bir Markdown dosyası: Reaktif Kütüphaneler 40+ Yedek Parça Router Sistemi Bir web sitesi ... ancak web sitesi daha az dikkat aldı - daha sonra ele alacağım bir boşluk Web sitesi öğelerinin açıklanması ve bir ana özelliğin eklenmesi dışında bu planda herhangi bir maddi değişiklik yapmadım, gelişimin sonunda deklaratif olay gating. İnşaat başlar Plan yerindeyse, Opus'ta token sınırımı vurdum. Hiçbir sorun yok - Konuşmanın yanı sıra plan dosyasından tam bağlamı olan Gemini 3'e (Yüksek) geçtim. Within minutes, Gemini generated - çekirdek reaktivite motoru - iki örnek dosyası ile birlikte: “Hello, World!” demosu, hem Bau benzeri sentezi hem de vDOM benzeri sentezi gösterir. lightview.js Then I made a mistake. “Web sitesini bir SPA olarak oluşturun” dedim, Lightview’i kullanmayı belirtmeden. When I returned, there was a beautiful website running in my browser. I looked at the code and my heart sank: . React with Tailwind CSS React + Tailwind SPAs için son derece yaygın bir modeldir. Lightview kullanmak için açık bir rehberlik olmadan - sadece inşa ettiğim çerçeve - LLM, eğitim verilerinde en sık gördüğü şeye varsayılan olarak. React + Tailwind SPAs için son derece yaygın bir modeldir. Lightview kullanmak için açık bir rehberlik olmadan - sadece inşa ettiğim çerçeve - LLM, eğitim verilerinde en sık gördüğü şeye varsayılan olarak. Daha da kötüsü, Lightview ile yeniden oluşturulmasını istediğimde, “önce mevcut siteyi silin” demeyi unuttum. When asking an LLM to redo work, be explicit about the approach: Guidance: Delete the existing site and rebuild from scratch using Lightview Mevcut siteyi Lightview kullanmak için değiştirin Bir LLM'nin çalışmasını yeniden yapmasını istediğinizde, yaklaşım hakkında açıkça konuşun: Guidance: Lightview kullanarak mevcut siteyi silin ve sıfırdan yeniden oluşturun Mevcut siteyi Lightview kullanmak için değiştirin Birincisi genellikle büyük değişiklikler için daha etkili. ikincisi hedefli düzeltmeler için daha iyidir. LLM otomatik olarak verimli yolu seçmez - onu yönlendirmelisiniz. The Tailwind Surprise Claude Lightview bileşenlerini kullanarak web sitesini oluşturduktan sonra, hala Tailwind CSS sınıfları ile dolu olduğunu fark ettim. “Evet,” Claude etkili bir şekilde açıkladı, “UI bileşenleri için DaisyUI’yi seçtiniz ve DaisyUI Tailwind’i bağımlılık olarak gerektiriyor. Ben semantik CSS sınıflarını tercih ettim ve sitenin klasik CSS yaklaşımlarını kullanmasını istedi. Bulma: LLM'ler makul ama bazen istenmeyen varsayımlar yapar. bağımlılıkları olan tek bir teknolojiyi belirttiğinizde, LLM'ler bu seçimi projenin ilgili bölümlerine genişletecektir. Bulma: LLM'ler makul ama bazen istenmeyen varsayımlar yapar. bağımlılıkları olan tek bir teknolojiyi belirttiğinizde, LLM'ler bu seçimi projenin ilgili bölümlerine genişletecektir. Rehberlik: İstediğiniz şeyleri, sadece istediğiniz şeyleri değil, açıkça söyleyin. örneğin, "DaisyUI bileşenlerini istiyorum, ancak başka bir yerde değil, sadece Tailwind'i kullanın." Rehberlik: İstediğiniz şeyleri, sadece istediğiniz şeyleri değil, açıkça söyleyin. örneğin, "DaisyUI bileşenlerini istiyorum, ancak başka bir yerde değil, sadece Tailwind'i kullanın." Klasik CSS ve semantik sınıfları kullanarak siteyi yeniden yazmasını istedim. tasarımı beğendim ve dosyaları silmek istemiyordum, bu yüzden tekrar çok sayıda dosyaya dokunduğundan çok fazla token tüketen bir refactor'dan muzdarip oldum. bir kez daha tokenler bitti ve GPT-OSS bit sentez hataları çekti ve çalışmaya devam etmek için başka bir IDE'ye geçmek zorunda kaldım. Rehberlik: Bir LLM kod tabanınızla mücadele ettiğinde, daha önce başarılı olan birine geri dönün. Farklı modeller proje bağlamını farklı "bilgi"ye sahiptir. Ve tokenler bittiğinde Antigravity kullanıyorsanız, aynı dizinde MS Visual Code'a geçebilir ve Claude ile hafif bir GitHub Copilot hesabı kullanabilirsiniz. Antigravity Görsel Kodu'na dayanıyor, bu yüzden çok benzer bir şekilde çalışır. Bir LLM kod tabanınızla mücadele ettiğinde, daha önce başarılı olan birine geri dönün. Farklı modeller projenizin bağlamını farklı "bilgi"ye sahiptir. Ve, tokenler bittiğinde Antigravity kullanıyorsanız, aynı dizinde MS Visual Code'a geçebilir ve Claude ile hafif bir GitHub Copilot hesabı kullanabilirsiniz. Antigravity Görsel Kodu'na dayanıyor, bu yüzden çok benzer bir şekilde çalışır. Guidance: İteratif Dansı Over the next few weeks, I worked to build out the website and test/iterate on components, I worked across multiple LLMs as token limits reset. Claude, Gemini, back to Claude. Each brought different strengths and weaknesses: excelled at architectural questions and generated clean website code with Lightview components Claude Pro consistently tried to use local tools and shell helper scripts to support its own work—valuable for speed and token efficiency. However, it sometimes failed with catastrophic results, many files zeroed out or corrupt with no option but to roll-back. Gemini Değişen bakış açıları güçlüydü: "Siz farklı bir LLM'siniz. düşünceleriniz nelerdir?" genellikle bir LLM'nin döndüğü hatalara yenilikçi fikirler veya hızlı düzeltmeler sağladı. Gerçek kazananı Gemini Flash'a buldum. Sintacık hatalarını içermeden kodları yenilemek için harika bir iş yaptı ve hangi kodu nereye koyacağına dair minimum rehberlik gerektiriyordu. Bazen bir değişikliğe şüpheciydim ve bunu söylerdim. Bazen Flash katılır ve ayarlanır ve diğer zamanlarda seçimi rasyonel bir şekilde haklı çıkarır. Ve hızlı konuşmak ... wow! The Router Evolution Router'ın da çalışması gerekiyordu. Claude başlangıçta bir hash tabanlı router uyguladı ( , Bu SPA için tamamen uygundur - basit, güvenilir ve sunucu yapılandırması gerektirmez. #/about #/docs But I had additional requirements I hadn't clearly stated: I wanted conventional paths ( ve ) for deep linking and SEO. Search engines can handle hash routes now, but path-based routing is still cleaner for indexing and sharing. /about /docs Hash-based routing is easier to implement and works without server-side configuration. Since I did not say I wanted path-based routing, the LLM will choose the simpler approach. Finding: LLMs will sometimes default to the simplest valid solution. Hash tabanlı yönlendirme uygulanması daha kolaydır ve sunucu tarafında yapılandırma olmadan çalışır. yol tabanlı yönlendirme istediğimi söylemediğim için, LLM daha basit bir yaklaşım seçecektir. Finding: LLMs will sometimes default to the simplest valid solution. Claude'a SEO ve derin bağlantı için geleneksel yollara ihtiyacım olduğunu söylediğimde, yönlendiriciyi çok hızlı bir şekilde yeniden yazdı ve akıllı bir çözüm olarak gördüğüm bir çözüm buldu - SPA sayfalarını hem derin bağlantı ve SEO-indeks edilebilir hale getiren bir hibrit yaklaşım. Bununla birlikte, orijinal kodun bir kısmını yerinde bıraktı ve tam olarak gereksizdi. Bu kodun hash tabanlı yolların kalıntılarını destekleyen bu kodu kaldırmak için söylemek zorunda kaldım. Bu kod kalıntıları kalıntıları varlığına yol açabilecek tür bir şeydir. Birçok insan LLM'yi suçlayacağını düşünüyorum, ancak başlangıçta açık olsaydım ve "tamamen yeniden yazarım" demiş olsaydım, kalıntılar var olmasaydı. Rehberlik: Mimarlık desenleri için, gereksinimleriniz hakkında erken açık olun. LLM'nin daha karmaşık ama SEO dostu yaklaşımı istediğinizi bildiğini düşünmeyin. Belirleyin: "SEO için Tarih API'si ile yol tabanlı yönlendirmeye ihtiyacım var" yerine sadece "Yönlendirmeye ihtiyacım var." Rehberlik: Mimarlık desenleri için, gereksinimleriniz hakkında erken açık olun. LLM'nin daha karmaşık ama SEO dostu yaklaşımı istediğinizi bildiğini düşünmeyin. Belirleyin: "SEO için Tarih API'si ile yol tabanlı yönlendirmeye ihtiyacım var" yerine sadece "Yönlendirmeye ihtiyacım var." Rehberlik: Ayrıca LLM'lerin önceki sürümlerle uyumluluk sağlamaya savunmasızca çalıştığını buldum, bu aşırı derecede karmaşık kodlara yol açabilir. Guidance: I also found that LLMs defensively try to ensure compatibility with previous versions, this can lead to overly complex code. If you are writing from scratch you need to remind them that backward compatibility is not required. rakamlarla karşılaştırma Son Tally Project Size: 60 JavaScript files, 78 HTML files, 5 CSS files 41,405 toplam kod satırları ( yorumlar ve boşluklar dahil) 40'ın üzerinde özel UI bileşenleri 70+ website files At this point, files seemed reasonable - not overly complex. But intuition and my biased feelings about code after more than 40 years of software development isn't enough. I decided to run formal metrics on the core files. Core Libraries: File Lines Minified Size lightview.js 603 7.75K lightview-x.js 1,251 20.2K lightview-router.js 182 3K lightview.js 603 7.75K Görüntülü Görüntülü Görüntü X.js 1 251 kez okundu 20.2 K Router.js Hakkında 182 3K web sitesi Çok iyi kaydetti Süper odaklı optimizasyon olmadan performans için. Galeri Yorumları Lighthouse Ardından karmaşıklık metrikleri geldi. The Slop Revealed I asked Gemini Flash to evaluate the code using three formal metrics: A combined metric where 0 is unmaintainable and 100 is perfectly documented/clean code. The calculation considers: 1. Maintainability Index (MI): Halstead Volume (measure of code size and complexity) Cyclomatic Complexity Lines of code Densite nasıl Scores above 65 are considered healthy for library code. This metric gives you a single number to track code health over time. Kodu aracılığıyla lineer olarak bağımsız yolların sayısını ölçen eski ama hala değerli bir metrik. 2. Cyclomatic Complexity: Daha fazla potansiyel bug Tamamen test etmek daha zordur (metrik aslında ne kadar yazmanız gerektiğini söyleyebilir) Anlamak için daha fazla kognitif yük Bir insanın kodunu anlamak için gereken zihinsel çabayı ölçen modern bir ölçümdir. (her kontrol akışını eşit şekilde ele alan) ciklomatik karmaşıklık aksine, bilişsel karmaşıklık cezalandırır: 3. Cognitive Complexity: Dikişli koşullar ve yuvarlaklar (daha derin dikiş = daha yüksek ceza) Boolean Operatör Zincirleri Recursion Lineer akışta kırılma The thresholds: 0-15: Temiz Kodu - anlaşılması ve sürdürülmesi kolay 16-25: Yüksek sürtünme - teknik borcunu azaltmak için refactoring önerildi 26+: Kritik - derhal dikkat gerektirir, bakım kabus Gemini Flash initially searched for an existing metrics library, couldn't find one, then ( ) using the Acorn JavaScript parser—without asking permission. This is both impressive and occasionally problematic. I cover the problem with this case later. Finding: LLMs excel at creating analysis tools. wrote its own complete analyzer metrics-analysis.js Gemini Flash başlangıçta mevcut bir metrik kütüphanesini aradı, sonra bulamadı ( ) Acorn JavaScript analizi kullanarak - izniniz olmadan. Bu etkileyici ve bazen sorunlu. Finding: LLMs excel at creating analysis tools. wrote its own complete analyzer metrics-analysis.js The Verdict Overall health looked good: File Functions Avg Maintainability Avg Cognitive Status lightview.js 58 65.5 3.3 ⚖️ Good lightview-x.js 93 66.5 3.6 ⚖️ Good lightview-router.js 27 68.6 2.1 ⚖️ Good Görüntüleme.js 58 65.5 3.3 ⚖️ Good lightview-x.js 93 66.5 3.6 ⚖️ Good lightview-router.js 27 68.6 2.1 ⚖️ Good But drilling into individual functions told a different story. Two functions hit "Critical" status: (Lightview x.js tarafından sağlandı) handleSrcAttribute Cognitive Complexity: 🛑 35 Cyclomatic Complexity: 🛑 22 Sürdürülebilirlik Endeksi: 33.9 (Lightview x.js tarafından sağlandı) Anonymous Template Processing Kognitif Karmaşıklık: 31 Cyclomatic Complexity: 13 This was slop. Technical debt waiting to become maintenance nightmares. Can AI Fix Its Own Slop? Here's where it gets interesting. The code was generated by Claude Opus, Claude Sonnet, and Gemini 3 Pro several weeks earlier. Could the newly released clean it up? Gemini 3 Flash Refactor için Flash istediğim to address its complexity. This seemed to take a little longer than necessary. So I aborted and spent some time reviewing its thinking process. There were obvious places it got side-tracked or even went in circles, but I told it to continue. After it completed, I manually inspected the code and thoroughly tested all website areas that use this feature. No bugs found. handleSrcAttribute Gemini Flash "thinks" extensively. While reviewing all its thought processes would be tedious, important insights flash by in the IDE. When an LLM seems stuck in a loop, aborts and review historical thoughts for possible sidetracks and tell to continue or redirect as needed. Critical Discovery #2: Gemini Flash "thinks" extensively. While reviewing all its thought processes would be tedious, important insights flash by in the IDE. When an LLM seems stuck in a loop, aborts and review historical thoughts for possible sidetracks and tell to continue or redirect as needed. Critical Discovery #2: After the fixes to , I asked for revised statistics to see the improvement. handleSrcAttribute Flash's Disappearing Act Unfortunately, Gemini Flash had deleted its file! It had to recreate the entire analyzer. metrics-analysis.js After Flash uses a script or analysis tool it creates, it often deletes the file assuming it is temporary. This happens even for files that take significant effort to create and that you might want to keep or reuse. Finding: Gemini Flash aggressively deletes temporary files. After Flash uses a script or analysis tool it creates, it often deletes the file assuming it is temporary. This happens even for files that take significant effort to create and that you might want to keep or reuse. Finding: Gemini Flash aggressively deletes temporary files. Tell Gemini to put utility scripts in a specific directory (like or ) and explicitly ask it to keep them. You can say: "Create this in /home/claude/tools/ and keep it for future use." Otherwise, you'll find yourself regenerating the same utilities multiple times. Guidance: /home/claude/tools/ /home/claude/scripts/ Gemini'ye, yardımcı scriptleri belirli bir dizine (örneğin or ) and explicitly ask it to keep them. You can say: "Create this in /home/claude/tools/ and keep it for future use." Otherwise, you'll find yourself regenerating the same utilities multiple times. Guidance: /home/claude/tools/ /home/claude/scripts/ The Dev Dependencies Problem İkizlere metrik senaryoları kalıcı olarak tutmalarını söylediğimde, başka bir sorun ortaya çıktı: resmi olarak dev bağımlılıkları yüklemeyi başaramadı. (the JavaScript parser). acorn Flash simply assumed that because it found packages in güvenli bir şekilde kullanılabilir. tek neden was available was because I'd already installed a Markdown parser that depended on it. node_modules acorn Bulmaca: LLM'ler her zaman bağımlılıkları doğru bir şekilde yönetmezler. node_modules'de mevcut olan her şeyi, package.json'da resmi olarak ilan edildiğini doğrulamadan kullanacaklar. İçinde bulunan her şeyi kullanıyorlar without verifying it's officially declared in . This creates fragile builds that break on fresh installs. Finding: LLMs don't always manage dependencies properly. node_modules package.json After an LLM creates utility scripts that use external packages, explicitly ask: "Did you add all required dependencies to package.json? Please verify and install any that are missing." Better yet, review the script's imports and cross-check against your declared dependencies yourself. Guidance: After an LLM creates utility scripts that use external packages, explicitly ask: "Did you add all required dependencies to package.json? Please verify and install any that are missing." Better yet, review the script's imports and cross-check against your declared dependencies yourself. Guidance: The Refactoring Results With the analyzer recreated, Flash showed how it had decomposed the monolithic function into focused helpers: (cognitive: 5) fetchContent Düşünce (Kognitive) 5 (cognitive: 7) updateTargetContent (cognitive: 2) elementsFromSelector orchestrator (cognitive: 10) handleSrcAttribute The Results Metric Before After Improvement Cognitive Complexity 35 🛑 10 ✅ -71% Cyclomatic Complexity 22 7 -68% Status Critical Slop Clean Code — Kognitif Karmaşıklık 35 10 -71% Cyclomatic Complexity 22 7 -68% Status Eleştirel Düşüş Clean Code — Manual inspection and thorough website testing revealed zero bugs. The cost? A 0.5K increase in file size - negligible. Emboldened, I tackled the template processing logic. Since it spanned multiple functions, this required more extensive refactoring: Extracted Functions: - iteration logic collectNodesFromMutations - scanning logic processAddedNode - template interpolation for text transformTextNode transformElementNode - Attribute Interpolation ve Recursion Results: Function Group Previous Max New Max Status MutationObserver Logic 31 🛑 6 ✅ Clean domToElements Logic 12 ⚠️ 6 ✅ Clean MutationObserver Logic 31 6 Clean Eşya mantığı 12 ⚠️ 6 ✅ temiz Kütüphane Final Metrics Refactoring'den sonra, lightview-x.js önemli ölçüde iyileştirildi: 93 → 103 (better decomposition) Functions: 66.5 → 66.8 Avg Maintainability: 3.6 → Avg Cognitive: 3.2 All critical slop eliminated. The increased function count reflects healthier modularity - complex logic delegated to specialized, low-complexity helpers. In fact, it is as good or better than established frameworks from a metrics perspective: File Functions Maintainability (min/avg/max) Cognitive (min/avg/max) Status lightview.js 58 7.2 / 65.5 / 92.9 0 / 3.4 / 25 ⚖️ Good lightview-x.js 103 0.0 / 66.8 / 93.5 0 / 3.2 / 23 ⚖️ Good lightview-router.js 27 24.8 / 68.6 / 93.5 0 / 2.1 / 19 ⚖️ Good react.development.js 109 0.0 / 65.2 / 91.5 0 / 2.2 / 33 ⚖️ Good bau.js 79 11.2 / 71.3 / 92.9 0 / 1.5 / 20 ⚖️ Good htmx.js 335 0.0 / 65.3 / 92.9 0 / 3.4 / 116 ⚖️ Good juris.js 360 21.2 / 70.1 / 96.5 0 / 2.6 / 51 ⚖️ Good lightview.js 58 7.2 / 65.5 / 92.9 0 / 3 / 25 ⚖️ Good lightview-x.js 103 0.0 / 66.8 / 93.5 0 / 3.2 / 23 ⚖️ Good lightview-router.js 27 24.8 / 68.6 / 93.5 0 / 2.1 / 19 ⚖️ Good react.development.js 109 0.0 / 65.2 / 91.5 0 / 2 / 33 ️İyi bau.js 79 11.2 / 71.3 / 92.9 0 / 1.5 / 20 ️İyi htmx.js 335 0.0 / 65.3 / 92.9 Hakkında 0 / 3.4 / 116 ️İyi juris.js 360 21.2 / 70.1 / 96,5 0 / 2.6 / 51 ️İyi 1. LLMs Ayna İnsan Davranışı - Daha İyi ve Daha Kötü için LLMs exhibit the same tendencies as average developers: Tam anlamı olmadan kodlara acele edin Yenilgiyi itiraf etmeyin ya da yeterince çabuk yardım isteyin Güvenilirliği artırmak için istendiğinde savunmasız, aşırı mühendislikli çözümler oluşturun Produce cleaner code with structure and frameworks The difference? They do it İnsanlara haftalar süren saatlerde tepenin dağlarını üretebilirler. faster and at greater volume 2. Thinking Helps Extended reasoning (visible in "thinking" modes) shows alternatives, self-corrections, and occasional "oh but" moments. The thinking is usually fruitful, sometimes chaotic. Don’t just leave or do something else when tasks you belive are comple or critical are being conducted. The LLMs rarely say "I give up" or "Please give me guidance" - I wish they would more often. Watch the thinking flow and abort the response request if necessary. Read the thinking and redirect or just say continue, you will learn a lot. 3. Multiple Perspectives Are Powerful İkinci bir LLM'ye, "Bu kodu inceleyen farklı bir LLM'siniz. Bulma: LLM'ler inanılmaz derecede savunmasızdır. Çok abstrak, yeterince abstrak veya verimsiz olarak eleştirilen bir uygulama karşısında, önde gelen LLM'ler (Claude, Gemini, GPT) tartışmayacak. Hızlı, kapsamlı bir analiz yapacak ve mevcut alternatif yaklaşımlara karşı dürüst avantajları / dezavantajları ile geri döneceklerdir. When faced with an implementation that's critiqued as too abstract, insufficiently abstract, or inefficient, leading LLMs (Claude, Gemini, GPT) won't argue. They'll do a rapid, thorough analysis and return with honest pros/cons of current versus alternative approaches. Finding: LLMs are remarkably non-defensive. This behavior is actually : beyond what most humans provide Kaç insan geliştiricisi herhangi bir savunma davranışı olmadan hızlı, ayrıntılı geri bildirim verir? Herhangi bir zamanda herhangi bir geliştiricinin sorgulama için kullanılabilir deneyimli mimarları olan kaç şirket var? Ego’nun katılması olmadan kaç kod inceleme konuşması olur? Before OR after making changes, switch LLMs deliberately: Guidance: Make progress with one LLM (e.g., Claude builds a feature) Switch to another (e.g., Gemini) and say: "You are a different LLM reviewing this implementation. What are your thoughts on the architecture, potential issues, and alternative approaches?" Then switch back to the first and ask what it thinks now! This is especially valuable before committing to major architectural decisions or after implementing complex algorithms. The second opinion costs just a few tokens but can save hours of refactoring later. Değişiklik yapmadan önce veya sonra, LLM'leri kasıtlı olarak değiştirin: Guidance: Make progress with one LLM (e.g., Claude builds a feature) Switch to another (e.g., Gemini) and say: "You are a different LLM reviewing this implementation. What are your thoughts on the architecture, potential issues, and alternative approaches?" Then switch back to the first and ask what it thinks now! This is especially valuable before committing to major architectural decisions or after implementing complex algorithms. The second opinion costs just a few tokens but can save hours of refactoring later. 4. Structure Prevents Slop Bulma: Bir LLM'yi "vanilla JavaScript" kullanmak için kısıtlamalar olmaksızın çağırır. Vanilla JavaScript, bazen kısıtlı veya tutarsız bir tarayıcı API'nin maruz kaldığı harika ama özgün olarak gevşek bir dildir. kısıtlamalar olmaksızın, hem insanlar hem de LLM'ler için sürdürülebilir kod oluşturmak kolaydır. Bir çerçeve belirlemek (Bau.js, React, Vue, Svelte, vb.) daha temiz, daha sürdürülebilir kodlara yol açan koruyucu çizgiler sağlar. Bulma: Bir LLM'yi "vanilla JavaScript" kullanmak için kısıtlamalar olmaksızın çağırır. Vanilla JavaScript, bazen kısıtlı veya tutarsız bir tarayıcı API'nin maruz kaldığı harika ama özgün olarak gevşek bir dildir. kısıtlamalar olmaksızın, hem insanlar hem de LLM'ler için sürdürülebilir kod oluşturmak kolaydır. Bir çerçeve belirlemek (Bau.js, React, Vue, Svelte, vb.) daha temiz, daha sürdürülebilir kodlara yol açan koruyucu çizgiler sağlar. Bir projeye başlarken, neyi gerçekleştirmek istediğinize göre aşağıdaki konularda tavsiye isteyin: Guidance: The framework/library to use (React, Vue, Svelte, etc.) The architectural pattern (MVC, MVVM, component-based, etc.) Kod organizasyonu tercihleri (fonksiyon tabanlı vs. katman tabanlı klasörler) İsim Sözleşmeleri Tip güvenliği için TypeScript veya JSDoc kullanmak Other libraries to use … no prevent re-invention. “JavaScript’te bir web uygulaması oluştur” demeyin, “Fonksiyonel bileşenler, kapaklar, TypeScript ve özellik tabanlı klasör organizasyonu kullanılarak bir React uygulaması oluşturun” demeyin. Daha fazla yapıyı önceden sağlarsanız, daha az eğilime sahip olacaksınız.Bu, sadece JavaScript'e değil tüm diller için de geçerlidir. Bir projeye başlarken, neyi gerçekleştirmek istediğinize göre aşağıdaki konularda tavsiye isteyin: Guidance: The framework/library to use (React, Vue, Svelte, etc.) Mimarlık örneği (MVC, MVVM, bileşen tabanlı vb.) Kod organizasyonu tercihleri (fonksiyon tabanlı vs. katman tabanlı klasörler) İsim Sözleşmeleri Tip güvenliği için TypeScript veya JSDoc kullanmak Other libraries to use … no prevent re-invention. Don't say: "Build me a web app in JavaScript" Do say: "Build me a React application using functional components, hooks, TypeScript, and feature-based folder organization. Follow Airbnb style guide for naming." Daha fazla yapıyı önceden sağlarsanız, daha az eğilime sahip olacaksınız.Bu, sadece JavaScript'e değil tüm diller için de geçerlidir. 5. Metrics Provide Objective Truth Resmi yazılım ölçütlerinin LLM gelişimini yönlendirebileceğini seviyorum. genellikle insan gelişimini elde etmek için çok sıkıcı, mekanik, zor veya pahalı olarak kabul edilirler, ancak LLM geliştirilmiş bir IDE'de, resmi kaynak analizini yapabilmek için kod yazabilen bir LLM'de (IDE eklentisi aboneliği gerektirmez), çok daha fazla dikkat almalıdırlar. Formal yazılım ölçütleri, geliştirmeyi objektif olarak yönlendirebilir. Identifying technical debt automatically Tracking code health over time Guiding refactoring priorities Validating that "improvements" actually improve things Formal yazılım ölçütleri, geliştirmeyi objektif olarak yönlendirebilir. Teknik borç otomatik olarak belirlenir Tracking code health over time Rehabilitasyon Öncelikleri “İyileştirmeler”in aslında işleri iyileştirdiğini doğrulamak Metrics don't lie. They identified the slop my intuition missed. Rehberlik: LLM iş akışınıza metrikler entegre edin: Run complexity metrics on all files. Identify functions with cognitive complexity > 15 or cyclomatic complexity > 10. After initial implementation: Address Critical (cognitive > 26) functions first, then "High Friction" (16-25) functions. Prioritize refactoring: Don't just say ‘improve this’. Say ‘Refactor handleSrcAttribute to reduce cognitive complexity to target range’. Request targeted refactoring: After refactoring, re-run metrics. Ensure complexity actually decreased and maintainability increased. Sometimes ‘improvements’ just shuffle complexity around. Verify improvements: Before marking code as done, try to have all functions with a cognitive complexity < 15 and maintainability index > 65. Set quality gates: Rehberlik: LLM iş akışınıza metrikler entegre edin: Run complexity metrics on all files. Identify functions with cognitive complexity > 15 or cyclomatic complexity > 10. After initial implementation: Öncelikle refaktorlama yapın: Önce Adres Kritik (bilinç > 26) fonksiyonları, daha sonra “Yüksek Sıkışma” (16-25) fonksiyonları. Hedefli refactoring isteyin: Sadece “buyi geliştir” demeyin. “Refactor handleSrcAttribute kognitif karmaşıklığı hedef aralığa azaltmak için” deyin. After refactoring, re-run metrics. Ensure complexity actually decreased and maintainability increased. Sometimes ‘improvements’ just shuffle complexity around. Verify improvements: Kalite kapılarını ayarlayın: Kod işareti yapmadan önce, tüm fonksiyonların bilişsel karmaşıklığı < 15 ve sürdürülebilirlik endeksi > 65 ile çalışın. The Verdict LLM oluşturulan kodun 40.000 satırından sonra, dikkatli bir şekilde iyimserim. Ama insan geliştiriciler gibi, onlara ihtiyacı vardır: Yes, LLMs can generate quality code. Açık ve ayrıntılı özellikler Structural constraints (frameworks, patterns) Düzenli Rehabilitasyon Rehberi Objective quality measurements Mimarlık kararları ile ilgili birçok bakış açısı The criticism that LLMs generate slop isn't wrong—but it's incomplete. They generate slop for the same reasons humans do: . unclear requirements, insufficient structure, and lack of quality enforcement Farklılık iterasyon hızıdır. inşa etmek ve refaktor yapmak için bir insan ekibi aylar alabilir, LLM'ler saatler içinde gerçekleştirebilir. Temizleme çalışmaları devam ediyor, ancak ilk nesil dramatik bir şekilde hızlanıyor. Looking Forward I'm skeptical that most humans will tolerate the time required to be clear and specific with LLMs - just as they don't today when product managers or developers push for detailed requirements from business staff. The desire to "vibe code" and iterate will persist. İşte ne değişti: The feedback loop has compressed from weeks to hours. We can now iterate and clean up faster when requirements evolve or prove insufficient. As coding environments evolve to wrap LLMs in better structure - automated metrics, enforced patterns, multi-model reviews -the quality will improve. We're not there yet, but the foundation is promising. Gerçek soru, LLM'lerin kalite kodunu üretebilecekleri değil, onları - ve kendimizi - sürekli olarak yapabilecekleri disiplinle sağlayabilecekler miyiz. Ve, son bir endişe var ... LLM'ler tarih üzerine kurulmuşsa ve bildikleri ile kalma eğilimindeyseniz, UI kütüphaneleri gibi şeylerin tanımını ve kullanımını nasıl geliştireceğiz? Farklı bir şey istemedikçe React'le sonsuza dek sıkıştık mı? Ya da kütüphaneler bir anahtarlık mı? LLM'ler ve görüntü veya video modelleri yakında temel kod olmadan bir kullanıcı arayüzünün gerekli görüntüsünü oluşturacak mı? Oyuna geç girişine ve zaten var olan ankara LLM'lere bakıldığında, Lightview'in kabul edilmesi için yüksek umutlara sahip değilim, ancak ilginç bir deneydi. https://lightview.dev
