Môžu LLM generovať kód kvality? 40 000-line experiment

Výkonné zhrnutie Strávil som štyri týždne na čiastočný úväzok (pravdepodobne 80 hodín celkovo) budovaním kompletného reaktívneho rámca používateľského rozhrania s viac ako 40 komponentmi, smerovačom a podporou interaktívnej webovej stránky pomocou iba kódu generovaného LLM, je to zrejmé . LLMs can produce quality code—but like human developers, they need the right guidance Kľúčové zistenia On Code Quality: Dobre špecifikované úlohy prinášajú čistý kód prvého priechodu Zle špecifikované alebo jedinečné požiadavky vedú k pomalým implementáciám Kód sa časom degraduje bez úmyselného refaktorovania LLM defenzívne over-engineer, keď sa požiada o zlepšenie spoľahlivosti On The Development Process: Je ťažké byť „dobre špecifikovaný“, keď je úloha veľká Rozšírené uvažovanie („myslenie“) prináša lepšie výsledky, hoci niekedy vedie k kruhovej alebo príliš rozsiahlej logike. Viaceré perspektívy LLM (prepínacie modely) poskytujú cennú architektonickú revíziu a pomoc pri riešení problémov Štruktúrované používanie rámca, napr. Bau.js alebo Lightview, zabraňuje sklonu lepšie ako neobmedzený vývoj Formálne metriky objektívne identifikujú a usmerňujú odstránenie zložitosti kódu Záver: V mnohých ohľadoch sa LLM správa ako priemerný človek, ktorý ich vycvičil - robia podobné chyby, ale oveľa rýchlejšie a vo väčšom rozsahu. Výzva Pred štyrmi týždňami som sa rozhodol odpovedať na otázku, ktorá bola v rozvojovej komunite horúco diskutovaná: Môžu LLM generovať podstatný kód kvality výroby? Kompletný, moderný reaktívny rámec používateľského rozhrania s množstvom vopred postavených komponentov, smerovač a podpornú webovú stránku s: Desaťtisíce riadkov JavaScript, CSS a HTML Pamäť, výkon a bezpečnostné aspekty Profesionálne UX a vývojárske skúsenosti Rozhodol som sa stavať (Súkromné ) – reaktívny rámec používateľského rozhrania, ktorý kombinuje najlepšie funkcie Bau.js, HTMX a Juris.js. Obmedzenie: 100% kód generovaný LLM pomocou Anthropic Claude (Opus 4.5, Sonnet 4.5) a Google Gemini 3 Pro (Flash nebol vydaný, keď som začal). Lightview Zoznamka.dev Začíname otázkami, nie kódom Začal som s Claude Opus: "Chcem vytvoriť reaktívnu knižnicu používateľského rozhrania, ktorá kombinuje HTMX, Bau a Juris. Pre hypermédiá uprednostňujem žiadne špeciálne atribútové mená – len vylepšené správanie. Chcem tiež spracovanie reťazcov v HTML, SPA smerovač, knižnicu komponentov používateľského rozhrania s automatickým vytváraním vlastných prvkov, aplikácie s podporou SEO bez dodatočnej práce a webovú stránku na propagáciu a vzdelávanie používateľov. "Chcem vytvoriť reaktívnu knižnicu používateľského rozhrania, ktorá kombinuje HTMX, Bau a Juris. Pre hypermédiá uprednostňujem žiadne špeciálne atribútové mená – len vylepšené správanie. Chcem tiež spracovanie reťazcov v HTML, SPA smerovač, knižnicu komponentov používateľského rozhrania s automatickým vytváraním vlastných prvkov, aplikácie s podporou SEO bez dodatočnej práce a webovú stránku na propagáciu a vzdelávanie používateľov. Claude sa spočiatku neponoril do kódu. : dozens of clarifying questions TypScript alebo vanilkový JavaScript? Ktorá knižnica komponentov používateľského rozhrania pre styling? (poskytla možnosti s výhodami a nevýhodami) Ktoré HTMX vlastnosti konkrétne? Hostiteľské preferencie ? Routingová stratégia ? Niekedy však začal písať kód skôr, ako som si myslel, že by mal byť pripravený a musel som zrušiť odpoveď a presmerovať ju. Zistenie: LLM majú silnú predispozíciu voči predčasnej generácii kódu. Dokonca aj keď sa im pripomína, aby ešte nekódovali, zabúdajú po niekoľkých interakciách. To sa deje so všetkými modelmi – Claude, Gemini, GPT. Zdá sa, že sú obzvlášť vyvolané, aby začali proces generovania, keď je daný príkladový kód, aj keď sú príklady poskytované vedľa otázok namiesto ako žiadosti o implementáciu. To sa deje so všetkými modelmi – Claude, Gemini, GPT. Zdá sa, že sú obzvlášť vyvolané, aby spustili proces generovania, keď je daný príkladový kód, aj keď sú príklady poskytnuté vedľa otázok namiesto ako žiadosti o implementáciu. Finding: LLMs have a strong bias toward premature code generation. Pokyny: Ak LLM začne generovať kód predtým, než ste pripravení, okamžite zrušte dokončenie a presmerujte: "Zatiaľ nevytvárajte kód. Máte viac otázok?" Možno budete musieť to opakovať viackrát, pretože LLM "zapomína" a posúva sa späť do generovania kódu. Plánovanie proti rýchlemu režimu prepínania v Antigravity alebo podobných režimoch v iných IDE by to malo pomôcť, ale je to nepríjemné používať opakovane. Lepším riešením by bolo: ak používateľ položí otázku, LLM by mal predpokladať, že chcú diskusiu, nie kód. Ak LLM začne generovať kód predtým, než ste pripravení, okamžite zrušte dokončenie a presmerujte: "Zatiaľ nevytvárajte kód. Máte ďalšie otázky?" Možno budete musieť opakovať to niekoľkokrát, pretože LLM "zapomína" a sa vráti k generovaniu kódu. Plánovanie vs rýchly režim prepínanie v Antigravity alebo podobných režimoch v iných IDE by malo pomôcť s tým, ale je nepríjemné používať opakovane. : Ak používateľ položí otázku, LLM by mal predpokladať, že chcú diskusiu, nie kód. Guidance: A better solution would be Po hodine vpred a späť, Claude konečne povedal: "Žiadne ďalšie otázky. chceli by ste, aby som vytvoril plán implementácie, pretože tam bude veľa krokov?" Výsledný plán bol komplexný - podrobný súbor Markdown s kontrolnými políčkami, návrhovými rozhodnutiami a úvahami pre: Reaktívna knižnica 40+ komponentov UI Routingový systém Webová stránka ... hoci webová stránka dostala menej pozornosti - medzera, ktorú by som neskôr riešil I did not make any substantive changes to this plan except for clarification on website items and the addition of one major feature, declarative event gating at the end of development. Stavba začína S plánom na mieste som zasiahol svoj tokenový limit na Opus. Žiadny problém - prešiel som na Gemini 3 (High), ktorý mal úplný kontext z konverzácie plus súbor plánu. V priebehu niekoľkých minút, Gemini generované -core reaktivity engine - spolu s dvoma príkladovými súbormi: demo "Hello, World!" zobrazujúce ako Bau-like syntax a vDOM-like syntax. lightview.js Potom som urobil chybu. "Vytvorte webovú stránku ako SPA," povedal som, bez toho, aby som špecifikoval použitie samotnej aplikácie Lightview. Keď som sa vrátil, tam bol krásny web beží v mojom prehliadači. Pozrel som sa na kód a moje srdce spadlo: . React with Tailwind CSS Hľadanie: LLM bude používať najbežnejšie / populárne riešenie, ak nešpecifikujete inak. React + Tailwind je extrémne bežný vzor pre SPAs. Bez výslovného usmernenia na použitie Lightview - samotný rámec, ktorý som práve vybudoval - LLM predvolene na to, čo videl najčastejšie v školiacich údajoch. Hľadanie: LLM bude používať najbežnejšie / populárne riešenie, ak nešpecifikujete inak. React + Tailwind je extrémne bežný vzor pre SPAs. Bez výslovného usmernenia na použitie Lightview - samotný rámec, ktorý som práve vybudoval - LLM predvolene na to, čo videl najčastejšie v školiacich údajoch. Worse, when I asked to rebuild it with Lightview, I forgot to say "delete the existing site first." So it processed and modified all 50+ files one by one, burning through tokens at an alarming rate. Pokyny: Keď požiadate LLM o opätovné vykonanie práce, buďte explicitní o prístupe: Odstránenie existujúcej lokality a prestavba od začiatku pomocou aplikácie Lightview vs Modify the existing site to use Lightview When asking an LLM to redo work, be explicit about the approach: Guidance: Odstránenie existujúcej lokality a prestavba od začiatku pomocou aplikácie Lightview vs Zmena existujúcej lokality na používanie aplikácie Lightview Prvý je často efektívnejší pre veľké zmeny. Druhý je lepší pre cielené opravy. LLM automaticky nevyberie efektívnu cestu - musíte ju nasmerovať. Tailwind prekvapenie Potom, čo Claude vytvoril webovú stránku pomocou komponentov Lightview, všimol som si, že je stále plná tried CSS Tailwind. "No," vysvetlil Claude účinne, "vybrali ste DaisyUI pre komponenty rozhrania užívateľského rozhrania a DaisyUI vyžaduje Tailwind ako závislosť. Uprednostňujem sémantické triedy CSS a chcel som, aby stránka používala klasické prístupy CSS. When you specify one technology that has dependencies, LLMs will extend that choice to related parts of the project. They're being logical, but they can't read your mind about preferences. Finding: LLMs make reasonable but sometimes unwanted inferences. When you specify one technology that has dependencies, LLMs will extend that choice to related parts of the project. They're being logical, but they can't read your mind about preferences. Finding: LLMs make reasonable but sometimes unwanted inferences. Pokyny: Buďte explicitní o tom, čo nechcete, nie len o tom, čo chcete. napr. „Chcem DaisyUI komponenty, ale používam len Tailwind pre ne a nie inde.“ Ak máte silné preferencie o architektonických prístupoch, uveďte ich vopred. Be explicit about what you don't want, not just what you do want. e.g. "I want DaisyUI components, but only use Tailwind for them not elsewhere." If you have strong preferences about architectural approaches, state them upfront. Guidance: Poprosil som Clauda, aby prepísal stránku pomocou klasických CSS a sémantických tried. Páčil sa mi dizajn a nechcel som odstrániť súbory, takže som opäť trpel refaktorom, ktorý spotreboval veľa žetónov, pretože sa dotkol toľkých súborov. When one LLM struggles with your codebase, switch back to one that was previously successful. Different models have different "understanding" of your project context. And, if you are using Antigravity when you run out of tokens, you can switch to MS Visual Code in the same directory and use a light GitHub Copilot account with Claude. Antigravity is based on Visual Code, so it works in a very similar manner. Guidance: Keď jeden LLM bojuje s vašou kódovou základňou, prepnite sa späť na ten, ktorý bol predtým úspešný. Rôzne modely majú iné "porozumenie" vášho kontextu projektu. A ak používate Antigravity, keď vyčerpáte tokeny, môžete prepnúť na MS Visual Code v rovnakom adresári a použiť ľahký účet GitHub Copilot s Claudeom. Antigravity je založený na vizuálnom kóde, takže funguje veľmi podobným spôsobom. Guidance: Iteratívny tanec Počas nasledujúcich niekoľkých týždňov som pracoval na vybudovaní webovej stránky a testovaní / iterácii na komponentoch, pracoval som na viacerých LLM ako reset tokenových limitov. Claude, Gemini, späť Claude. Každý priniesol rôzne silné a slabé stránky: excelled at architectural questions and generated clean website code with Lightview components Claude Gemini Pro sa neustále snažil používať lokálne nástroje a skripty nástrojov na podporu svojej vlastnej práce – cenné pre rýchlosť a efektívnosť tokenov. Prechodné perspektívy sa ukázali ako silné: "Si iný LLM. Aké sú vaše myšlienky?" často priniesol prelomové poznatky alebo rýchle opravy chýb, na ktorých sa jeden LLM točil. Zistil som, že skutočným víťazom je Gemini Flash. Urobil úžasnú prácu refaktorovania kódu bez zavedenia syntaxných chýb a potreboval minimálne usmernenia o tom, ktorý kód dať kam. Niekedy som bol skeptický ohľadom zmeny a povedal by to. Niekedy by Flash súhlasil a upravil a inokedy by urobil racionálne odôvodnenie svojej voľby. Vývoj routeru The router also needed work. Claude initially implemented a hash-based router ( , , , etc.). This is entirely appropriate for an SPA—it's simple, reliable, and doesn't require server configuration. #/about #/docs But I had additional requirements I hadn't clearly stated: I wanted conventional paths ( , Vyhľadávače môžu teraz zvládnuť hash trasy, ale smerovanie založené na ceste je stále čistejšie pre indexovanie a zdieľanie. /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-založené smerovanie je jednoduchšie implementovať a funguje bez konfigurácie na strane servera. Keďže som nepovedal, že chcem smerovanie založené na ceste, LLM si zvolí jednoduchší prístup. Finding: LLMs will sometimes default to the simplest valid solution. Keď som povedal Claude, že som potreboval konvenčné cesty pre SEO a hlboké prepojenie, veľmi rýchlo prepisoval smerovač a prišiel s tým, čo považujem za šikovné riešenie - hybridný prístup, ktorý robí stránky SPA hlboko prepojené a SEO indexovateľné bez zložitosti renderovania na strane servera. Avšak, nechal niektorý z pôvodného kódu na mieste, ktorý druh zatienil, čo sa deje a bolo úplne zbytočné. Musel som mu povedať, aby odstránil tento kód, ktorý podporoval zvyšky hashových trás. Toto zachovanie kódu je druh vecí, ktoré môžu viesť k pádu. Predpokladám, že mnohí ľudia by obviňovali LLM, ale keby som bol jasný, aby som začal a povedal aj "úplne prepisovať môj", hádaj, že zvyšky by neexist For architectural patterns, be explicit about your requirements early. Don't assume the LLM knows you want the more complex but SEO-friendly approach. Specify: "I need path-based routing with History API for SEO" rather than just "I need routing." Guidance: For architectural patterns, be explicit about your requirements early. Don't assume the LLM knows you want the more complex but SEO-friendly approach. Specify: "I need path-based routing with History API for SEO" rather than just "I need routing." Guidance: Usmernenie: Zistil som tiež, že LLM sa defenzívne snažia zabezpečiť kompatibilitu s predchádzajúcimi verziami, čo môže viesť k príliš zložitému kódu. Usmernenie: Zistil som tiež, že LLM sa defenzívne snažia zabezpečiť kompatibilitu s predchádzajúcimi verziami, čo môže viesť k príliš zložitému kódu. Porovnanie čísel The Final Tally Project Size: 60 JavaScript súborov, 78 HTML súborov, 5 CSS súborov 41,405 celkových riadkov kódu (vrátane komentárov a prázdnych bodov) Viac ako 40 komponentov custom UI 70+ webové stránky súbory V tomto bode sa zdalo, že súbory sú rozumné - nie príliš zložité. ale intuícia a moje zaujaté pocity o kóde po viac ako 40 rokoch vývoja softvéru nestačia. 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 lightview-x.js 1,251 20.2 K Prehľadávač lightview-router.js 182 3K The website Dobré skóre na for performance without having had super focused optimization. Galéria komponentov Lighthouse Potom však prišli metriky zložitosti. Slope odhalil Požiadal som Gemini Flash, aby vyhodnotil kód pomocou troch formálnych metrík: 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) Cyklomatická zložitosť riadky kódu Ako hustotu Hodnoty nad 65 sú považované za zdravé pre kód knižnice. Táto metrika vám dáva jediné číslo na sledovanie stavu kódu v priebehu času. Staršia, ale stále cenná metrika, ktorá meria počet lineárne nezávislých ciest prostredníctvom kódu. 2. Cyclomatic Complexity: Viac potenciálnych bugov Ťažšie testovať dôkladne (metrika vám môže skutočne povedať, koľko budete musieť napísať) Viac kognitívne zaťaženie pochopiť A modern metric that measures the mental effort a human needs to understand code. Unlike cyclomatic complexity (which treats all control flow equally), cognitive complexity penalizes: 3. Cognitive Complexity: Hniezdené kondicionéry a kruhy (hlbšie hniezdenie = vyššia pokuta) Boolean operator chains Recursion Prerušenie lineárneho toku The thresholds: 0-15: Čistý kód - ľahko pochopiteľný a udržiavaný High Friction - refactoring suggested to reduce technical debt 16-25: Critical - immediate attention needed, maintenance nightmare 26+: 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 spočiatku hľadal existujúcu metrikovú knižnicu, nemohol ju nájsť, potom ( ) 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 rozsudok Celkový zdravotný stav bol dobrý: 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 lightview.js 58 65.5 3.3 ️Dobré Prehľad Lightview-x.js 93 66.5 3.6 ️Dobré 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): handleSrcAttribute Kognitívna zložitosť: 35 Cyclomatic Complexity: 🛑 22 Index udržateľnosti: 33,9 (lightview-x.js): Anonymous Template Processing Kognitívna zložitosť: 31 Cyclomatic Complexity: 13 This was slop. Technical debt waiting to become maintenance nightmares. Can AI Fix Its Own Slop? Kód bol generovaný Claude Opus, Claude Sonnet, a Gemini 3 Pro niekoľko týždňov skôr. Vyčistiť to hore? Gemini 3 Flash I asked Flash to refactor 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 Požiadal som o revidované štatistiky, aby som videl zlepšenie. handleSrcAttribute Flashov zmizajúci zákon 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. Potom, čo Flash používa skript alebo analytický nástroj, ktorý vytvorí, často odstráni súbor za predpokladu, že je dočasný. 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/ Tell Gemini to put utility scripts in a specific directory (like alebo ) 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 Keď som povedal Gemini udržať metriky skripty natrvalo, ďalší problém sa objavil: to sa nepodarilo oficiálne nainštalovať dev závislostí ako (the JavaScript parser). acorn Flash simply assumed that because it found packages in , it could safely use them. The only reason bol k dispozícii, pretože som už nainštaloval analyzátor Markdown, ktorý na ňom závisel. node_modules acorn They'll use whatever's available in 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 They'll use whatever's available in 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 Pokyny: Potom, čo LLM vytvorí utility skripty, ktoré používajú externé balíky, výslovne sa opýtajte: "Dali ste všetky potrebné závislosti do package.json? prosím overte a nainštalujte niektoré, ktoré chýbajú." 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: Reakčné výsledky S analyzátorom obnoveným, Flash ukázal, ako rozložil monolitickú funkciu na zameraných pomocníkov: (cognitive: 5) fetchContent ParseElements (kognitívne: 5) (cognitive: 7) updateTargetContent (cognitive: 2) elementsFromSelector rukoväťSrcAttribute orchestrator (kognitívne: 10) The Results Metric Before After Improvement Cognitive Complexity 35 🛑 10 ✅ -71% Cyclomatic Complexity 22 7 -68% Status Critical Slop Clean Code — kognitívna zložitosť 35 10 -71% Cyclomatic Complexity 22 7 -68% Status Kritický skok Čistý kód — 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: collectNodesFromMutácie - iteračná logika - scanning logic processAddedNode - template interpolation for text transformTextNode transformElementNode - atribút interpolácie a recursie Results: Function Group Previous Max New Max Status MutationObserver Logic 31 🛑 6 ✅ Clean domToElements Logic 12 ⚠️ 6 ✅ Clean MutationObserver Logic 31 🛑 6 ✅ Čistý Domáca logika 12 ️ 6 ✅ Čistý Konečné metriky knižnice Po refaktorovaní sa lightview-x.js výrazne zlepšil: 93 → 103 (better decomposition) Functions: Avg Údržba: 66.5 → 66.8 3.6 → Avg Cognitive: 3.2 Zvýšený počet funkcií odráža zdravšiu modulárnosť - komplexnú logiku delegovanú na špecializovaných pomocníkov s nízkou zložitosťou. 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.4 / 25 ⚖️ Good lightview-x.js 103 0.0 / 66.8 / 93.5 0 / 3.2 / 23 ️Dobré lightview-router.js 27 24.8 / 68.6 / 93.5 0 / 2 / 19 ⚖️ Good react.development.js 109 0.0 / 65.2 / 91.5 0 / 2 / 33 ⚖️ Good bau.js 79 11.2 / 71.3 / 92.9 0 / 1.5 / 20 ️Dobré htmx.js 335 0.0 / 65,3 / 92,9 0 / 3,4 / 116 ️Dobré juris.js 360 21.2 / 70.1 / 96.5 0 / 2.6 / 51 ️Dobré LLM zrkadlo ľudského správania – pre lepšie a horšie LLMs exhibit the same tendencies as average developers: Rush do kódu bez úplného pochopenia Don't admit defeat or ask for help soon enough Generate defensive, over-engineered solutions when asked to improve reliability Produce cleaner code with structure and frameworks Rozdiel je v tom, že to robia . They can generate mountains of slop in hours that would take humans weeks. 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. Viaceré perspektívy sú mocné When I told a second LLM, "You are a different LLM reviewing this code. What are your thoughts?", magic happened. Hľadanie: LLMs sú pozoruhodne non-defenzívne. Keď čelí implementácii, ktorá je kritizovaná ako príliš abstraktná, nedostatočne abstraktná alebo neefektívna, vedúce LLMs (Claude, Gemini, GPT) sa nebudú hádať. Keď čelí implementácii, ktorá je kritizovaná ako príliš abstraktná, nedostatočne abstraktná alebo neefektívna, vedúce LLM (Claude, Gemini, GPT) sa nebude hádať. Finding: LLMs are remarkably non-defensive. Toto správanie je v skutočnosti : beyond what most humans provide How many human developers give rapid, detailed feedback without any defensive behavior? How many companies have experienced architects available for questioning by any developer at any time? Koľko konverzácií o preskúmaní kódu sa deje bez toho, aby sa zapojilo ego? 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. Pred alebo po vykonaní zmien prepnite LLM úmyselne: 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 Nájdenie: Povedanie LLM používať "vanilla JavaScript " bez obmedzení vyzýva na sklon. Vanilla JavaScript je nádherný, ale prirodzene voľný jazyk, prostredníctvom ktorého je vystavený niekedy špinavý alebo nekonzistentný prehliadač API. Bez obmedzení je ľahké vytvoriť nezadržateľný kód - pre ľudí aj LLM. Určenie rámca (Bau.js, React, Vue, Svelte, atď.) poskytuje záložky, ktoré vedú k čistejšiemu, udržateľnejšiemu kódu. Nájdenie: Povedanie LLM používať "vanilla JavaScript " bez obmedzení vyzýva na sklon. Vanilla JavaScript je nádherný, ale prirodzene voľný jazyk, prostredníctvom ktorého je vystavený niekedy špinavý alebo nekonzistentný prehliadač API. Bez obmedzení je ľahké vytvoriť nezadržateľný kód - pre ľudí aj LLM. Určenie rámca (Bau.js, React, Vue, Svelte, atď.) poskytuje záložky, ktoré vedú k čistejšiemu, udržateľnejšiemu kódu. When starting a project, based on what you want to accomplish ask for advice on: Guidance: The framework/library to use (React, Vue, Svelte, etc.) The architectural pattern (MVC, MVVM, component-based, etc.) Code organization preferences (feature-based vs. layer-based folders) Naming conventions Whether to use TypeScript or JSDoc for type safety 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." The more structure you provide upfront, the less slop you'll get. This applies to all languages, not just JavaScript. When starting a project, based on what you want to accomplish ask for advice on: Guidance: The framework/library to use (React, Vue, Svelte, etc.) The architectural pattern (MVC, MVVM, component-based, etc.) Code organization preferences (feature-based vs. layer-based folders) Názov konvencie Použitie TypeScript alebo JSDoc pre typovú bezpečnosť Other libraries to use … no prevent re-invention. Nepovedzte: "Vytvorte mi webovú aplikáciu v jazyku JavaScript" Povedzte: "Vytvorte mi aplikáciu React pomocou funkčných komponentov, hákov, TypeScript a organizácie priečinkov založených na funkciách. The more structure you provide upfront, the less slop you'll get. This applies to all languages, not just JavaScript. 5. Metrics Provide Objective Truth Často sa považujú za príliš nudné, mechanické, ťažké alebo nákladné na získanie pre ľudský rozvoj, ale v IDE s LLM s LLM, ktorý môže písať kód na vykonanie formálnej analýzy zdrojov (bez potreby predplatného IDE pluginu), by mali získať oveľa viac pozornosti, než robia. They're perfect for: Finding: Formal software metrics can guide development objectively. Identifying technical debt automatically Tracking code health over time Guiding refactoring priorities Validating that "improvements" actually improve things They're perfect for: Finding: Formal software metrics can guide development objectively. Automatická identifikácia technického dlhu Sledovanie zdravia v priebehu času Guiding refactoring priorities Potvrdenie, že „zlepšenia“ skutočne zlepšujú veci Metriky neklamú, identifikovali sklon, ktorý mi intuícia chýbala. Integrate metrics into your LLM workflow: Guidance: Run complexity metrics on all files. Identify functions with cognitive complexity > 15 or cyclomatic complexity > 10. After initial implementation: Prioritizujte refaktoring: Najprv funkcie Address Critical (kognitívne > 26), potom funkcie "High Friction" (16-25) 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 65. Set quality gates: Integrate metrics into your LLM workflow: Guidance: Run complexity metrics on all files. Identify functions with cognitive complexity > 15 or cyclomatic complexity > 10. After initial implementation: Prioritizujte refaktoring: Najprv funkcie Address Critical (kognitívne > 26), potom funkcie "High Friction" (16-25) 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: Nastavte brány kvality: Pred označením kódu ako vykonaného sa pokúste mať všetky funkcie s kognitívnou zložitosťou 65. The Verdict Po 40 000 riadkoch kódu generovaného LLM som opatrne optimistický. Ale rovnako ako ľudskí vývojári, potrebujú: Yes, LLMs can generate quality code. Jasné a podrobné špecifikácie Štrukturálne obmedzenia (rámce, vzory) Pravidelný návod na rekonštrukciu Objektívne merania kvality Multiple perspectives on architectural decisions Kritika, že LLM generujú sklon, nie je nesprávna - ale je to neúplné. . unclear requirements, insufficient structure, and lack of quality enforcement The difference is iteration speed. What might take a human team months to build and refactor, LLMs can accomplish in hours. The cleanup work remains, but the initial generation accelerates dramatically. Looking Forward Som skeptický, že väčšina ľudí bude tolerovať čas potrebný na to, aby boli jasné a špecifické s LLM - rovnako ako dnes, keď manažéri produktov alebo vývojári tlačia na podrobné požiadavky od zamestnancov podniku. Tu je to, čo sa zmenilo: Spätná väzba sa zmenšila z týždňov na hodiny. We can now iterate and clean up faster when requirements evolve or prove insufficient. Ako sa prostredia kódovania vyvíjajú, aby obložili LLM v lepšej štruktúre - automatizované metriky, vynútené vzory, preskúmanie viacerých modelov - kvalita sa zlepší. The real question isn't whether LLMs can generate quality code. It's whether we can provide them - and ourselves - with the discipline to do so consistently. And, I have a final concern … if LLMs are based on history and have a tendency to stick with what they know, then how are we going to evolve the definition and use of things like UI libraries? Are we forever stuck with React unless we ask for something different? Or, are libraries an anachronism? Will LLMs and image or video models soon just generate the required image of a user interface with no underlying code? Vzhľadom na jeho neskorý vstup do hry a zakotvenie LLM už majú, nemám vysoké nádeje na prijatie Lightview, ale to bol zaujímavý experiment. https://lightview.dev