Հիմնական համոզվածություն Ես փնտրել եմ 4 շաբաթը անմիջապես (պատկապես 80 ժամ) կառուցել ամբողջական ռեակտիկ UI սարքավորումներ, 40+ բաղադրիչներ, router, եւ աջակցում է ինտերնետային կայքը, օգտագործելով միայն LLM- ի արտադրված կոդը, դա բացահայտ է: . LLMs can produce quality code—but like human developers, they need the right guidance Հիմնական արդյունքները On Code Quality: Բարձր ճշգրիտ գործիքները արտադրում են clean first-pass կոդը Պահպանված կամ միասնական պահանջները արտադրում են խոշոր արտադրություններ Code degrades հետ ժամանակի ընթացքում, առանց մանրամասն refactoring LLM-ները պաշտպանականորեն over-engineer, երբ պահանջվում է բարելավել հավասարությունը On The Development Process: It is hard to be “well specified” when a task is large Բարձրացվել դիզայնը ("նշում") արտադրում է ավելի լավ արդյունքներ, բայց երբեմն հագուստային կամ գերազանց հագուստային ռեժիմը: Multiple LLM պլաստակներ (մոդելների փոխանակման) ապահովում է գեղեցիկ դիզայնային վերահսկման եւ debugging օգնություն Structured Framework- ի օգտագործումը, ինչպիսիք են Bau.js- ը կամ Lightview- ը, ավելի լավ է փակել, քան անսահմանափակ զարգացման Formal metrics- ը բացառապես identify է եւ ուղեցույց է սեղմել սեղմման հարմարավետությունը The bottom line: In many ways LLMs behave like the average of the humans who trained them—they make similar mistakes, but much faster and at greater scale. Hence, you can get six months of maintenance and enhancement “slop” 6 minutes after you generate an initial clean code base and then ask for changes. Արդյունքը Երկու շաբաթ առաջ, ես սկսել է պատասխանել հարցը, որը խոշորորեն խոսել է զարգացման թիմում: կարող է LLMs ստեղծել բնական, արտադրության որակի կոդը: Ոչ մի խաղալիքային ծրագրի, ոչ մի պարզ CRUD ծրագրի: Մի ամբողջական, आधुनिक ռեակտիկ UI սարքավորումներ, որոնք ունի շատ նախընտրված բաղադրիչներ, router եւ աջակցող կայքը: Կարդալ JavaScript- ի, CSS- ի եւ HTML- ի միասին Memory, Performance, եւ անվտանգության հարցեր Professional UX եւ Developer փորձը Ես ընտրել եմ կառուցել (Տեսանյութ) ) — մի ռեժիմային UI սարքի, որը համատեղում է Bau.js, HTMX, եւ Juris.js- ի լավագույն առանձնահատկությունները: 100% LLM- ի արտադրված կոդը, օգտագործելով Anthropic- ի Claude- ը (Opus 4.5, Sonnet 4.5) եւ Google- ի Gemini 3 Pro- ը (Flash- ը չի ազատվել, երբ ես սկսեցի). Lightview Տեսակներ.dev Հիմնական հարցեր, ոչ մի կոդը Ես սկսել եմ Claude Opus- ի հետ: «Ես ուզում եմ ստեղծել մի ռեակտիկային UI գրասենյակ, որը համատեղում է HTMX, Bau, եւ Juris- ը: Հիբերմանայի համար, ես ցանկանում եմ ոչ մի մասնավոր բաղադրիչ անուններ, պարզապես բարելավված բաղադրիչներ: Ես ուզում եմ նաեւ HTML- ում գծի գրասենյակային բաղադրիչ, SPA ռեակտոր, UI բաղադրիչների գրասենյակը, որը ավտոմատ custom element ստեղծում է, SEO- ի հարմարեցված ծրագրեր, որոնք ոչ մի լրացուցիչ աշխատանք չեն ունենում, եւ կայքը օգտագործողների առաջարկել եւ ուսուցման համար: Դուք ունեք որեւէ հարցեր:» «Ես ուզում եմ ստեղծել մի ռեակտիկային UI գրասենյակ, որը համատեղում է HTMX, Bau, եւ Juris- ը: Հիբերմանայի համար, ես ցանկանում եմ ոչ մի մասնավոր բաղադրիչ անուններ, պարզապես բարելավված բաղադրիչներ: Ես ուզում եմ նաեւ HTML- ում գծի գրասենյակային բաղադրիչ, SPA ռեակտոր, UI բաղադրիչների գրասենյակը, որը ավտոմատ custom element ստեղծում է, SEO- ի հարմարեցված ծրագրեր, որոնք ոչ մի լրացուցիչ աշխատանք չեն ունենում, եւ կայքը օգտագործողների առաջարկել եւ ուսուցման համար: Դուք ունեք որեւէ հարցեր:» Claude-ը առաջին անգամ չգիտել է կոդը: Դա հարցրեց : dozens of clarifying questions TypeScript կամ vanilla JavaScript- ը Ո՞ր բաղադրիչի բաղադրիչի բաղադրիչը ստանդարտելու համար: (Տեսանյութը առաջարկում է տարբերակներ pro/cons- ի հետ) Ո՞վ է HTMX-ը հատկապես առաջարկում Հաջորդ էջ » Preferences? Հիմնական ռեժիմի՞ն է? However, at times it started to write code before I thought it should be ready and I had to abort a response and redirect it. Տեսագրություն: LLM- ները ուժեղ պակասներ են առաջադեմ կոդը արտադրման համար: Երբ մոռացվում են, որ դեռ չգիտեն կոդը, նրանք մոռանում են, քանի որ մի քանի ինտերնետներ են: Այսպիսով են բոլոր մոդելները, ինչպիսիք են Claude, Gemini, GPT- ը: Նրանք կարծում են, որ հատկապես մոռացվում են սկսել արտադրական գործընթացը, երբ մոռացվում է օրինակային կոդը, նույնիսկ երբ մոռացվում են հարցերի հետ, այլեւ մոռացման պահանջների համար: Երբ մոռացվում են, որ ոչինչ չի սեղմում, նրանք մոռացվում են, երբ մի քանի ինտերնետներ են կատարում: Այսպես է կատարվում բոլոր մոդելների հետ: Claude, Gemini, GPT: Նրանք հատկապես տեսնում են, որ մոռացվում են սկսել արտադրական գործընթացը, երբ մոռացվում է օրինակային կոդը, նույնիսկ երբ մոռացվում են հարցերի հետ, այլեւ տեղադրման պահանջների համար: Finding: LLMs have a strong bias toward premature code generation. If an LLM starts generating code before you're ready, cancel the completion immediately and redirect: "Don't generate code yet. Do you have more questions?" You may need to repeat this multiple times as the LLM "forgets" and drifts back toward code generation. The Planning vs Fast mode toggle in Antigravity or similar modes in other IDE’s should help with this, but it's inconvenient to use repeatedly. : if the user asks a question, the LLM should assume they want discussion, not code. Only generate/modify code when explicitly requested or after asking permission. Guidance: A better solution would be Եթե LLM- ը սկսում է արտադրել կոդը, երբ դուք պատրաստ եք, անմիջապես փոխարինեք ավարտը եւ վերլուծեք: «Այսից դեռ չեք արտադրել կոդը: Դուք ունեք այլ հարցեր:» Դուք կարող եք պետք է վերլուծել այս մի քանի անգամ, քանի որ LLM- ը «լուծում է» եւ վերլուծում է կոդը արտադրում: The Planning vs. Fast mode switch in Antigravity կամ այլ IDE- ում նման ձեւերը պետք է օգնեն այս հետ, բայց այն չի հարմար է օգտագործել մի քանի անգամ: : if the user asks a question, the LLM should assume they want discussion, not code. Only generate/modify code when explicitly requested or after asking permission. Guidance: A better solution would be Կլուդը վերջապես ասում է: «Այսից ավելի հարցեր չէ: Դուք ցանկանում եք, որ ես ստեղծել եմ տեղադրման պլան, քանի որ պետք է շատ քայլեր լինի»: Արդյունաբերական պլանը ամբողջական էր - մանրամասն Markdown ֆայլը checkboxes- ի հետ, դիզայնի որոշումներ եւ փոխանակման համար: Հիմնական Reactive Libraries 40+ բաղադրիչներ Routing համակարգը A website ... քանի որ կայքը ստացել է ավելի քիչ ուշադրություն - մի խոշորությունը, որ ես կարող եմ վերահսկել հետո Ես ոչինչ չի փոխել այս պլանը, այլեւ բացահայտել կայքի մասերը եւ ավելացնել մեկ հիմնական առանձնահատկություն, deklarative event gating է վերջնական զարգացման. Բարձրությունը սկսվում է Ոչ մի խնդիր, ես փոխվել եմ Gemini 3 (High), որը ունի ամբողջ բաղադրիչը փոխանակման ֆայլից եւ Plan ֆայլը: Երկու րոպեվա ընթացքում, Gemini- ը ստեղծվել է — core reactivity մեքենա, ինչպես նաեւ երկու օրինակային ֆայլեր: «Hello, World!», որը ցույց է տալիս Bau-like syntax- ը եւ vDOM-like syntax- ը: lightview.js Այսպիսով, ես ստացել եմ մի սխալ. "Build the website as an SPA," I said, without specifying to use Lightview itself. I left for lunch. Երբ ես վերադարձել եմ, մի գեղեցիկ կայքը աշխատում է իմ բեռնելում. Ես տեսել եմ կոդը եւ իմ սիրո խառնացել է: . React with Tailwind CSS React + Tailwind is an extremely common pattern for SPAs. Without explicit guidance to use Lightview—the very framework I'd just built—the LLM defaulted to what it had seen most often in training data. Finding: LLMs will use the most common/popular solution if you don't specify otherwise. React + Tailwind is an extremely common pattern for SPAs. Without explicit guidance to use Lightview—the very framework I'd just built—the LLM defaulted to what it had seen most often in training data. Finding: LLMs will use the most common/popular solution if you don't specify otherwise. 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. Պաշտպանություն: Երբ ցանկանում եք LLM- ը վերցնել աշխատանքը, պետք է բացահայտեք, թե ինչպես է վերցնել: Delete the existing site and rebuild from scratch using Lightview Տեսանյութը փոխել է Lightview-ը Երբ ցանկանում եք LLM- ը վերադառնալ աշխատանքի համար, պետք է բացահայտեք, թե ինչպես է ճշգրտվել: Guidance: Տեղադրեք տեղադրված կայքը եւ վերահսկել Lightview- ի միջոցով Տեսանյութը փոխել է Lightview-ը Առաջինը սովորաբար ավելի արդյունավետ է մեծ փոխանցման համար: Առաջինը ավելի լավ է տեղադրված վերահսկման համար: LLM- ը ավտոմատորեն չի ընտրում արդյունավետ ճանապարհը: Դուք պետք է վերահսկել այն: The Tailwind Ապրիշը Երբ Claude-ը ստեղծել է կայքը, օգտագործելով Lightview- ի բաղադրիչները, ես տեսել եմ, որ այն դեռ ունի Tailwind CSS դասընթացներ: Ես հարցրեց Claude-ին այս մասին: «Այսպիսին,» ասում է Claude-ը, «Ես ընտրել եմ DaisyUI- ը UI- ի մասերի համար, եւ DaisyUI-ը պահանջում է Tailwind- ը, քանի որ այն պետք է օգտագործվի ամբողջ կայքում: Ես կարծում եմ, որ դուք լավ եք, որ Tailwind- ը օգտագործվում է ամբողջ կայքում». Fair point—but I wasn't okay with it. I prefer semantic CSS classes and wanted the site to use classic CSS approaches. Տեղադրում: LLM-ները անում են ճշգրիտ, բայց երբեմն չժանգահարված ճշգրտություններ: Երբ դուք նշում եք մի տեխնոլոգիան, որը ունի սխալներ, LLM-ները պետք է լայնացնել այդ ընտրությունը նախագծի հետ կապված մասերի համար: Նրանք անում են, բայց նրանք չեն կարող կարդալ ձեր զգացմունքների մասին: Երբ դուք նշեք մի տեխնոլոգիան, որը ունի բախվածություններ, LLMs կլանավորվի այդ ընտրությունը հետազոտական մասերի նախագծի. Նրանք են logical, բայց նրանք չեն կարող կարդալ ձեր զգացմունքների մասին հարմարություններ. Finding: LLMs make reasonable but sometimes unwanted inferences. «Ես ուզում եմ DaisyUI բաղադրիչները, բայց միայն օգտագործեք Tailwind- ը նրանց համար, այլ ոչ մի այլ վայրում»: Եթե դուք ունեք խոշոր հարմարավետություն դիզայնային հարմարություններների մասին, նշեք նրանց առաջ. «Ես ուզում եմ DaisyUI բաղադրիչները, բայց միայն օգտագործեք Tailwind- ը նրանց համար, այլ ոչ մի այլ վայրում»: Եթե դուք ունեք խոշոր հարմարավետություն դիզայնային հարմարություններների մասին, նշեք այն առաջ: Guidance: Ես սիրում եմ դիզայնը եւ չգիտեմ ֆայլերը, այնպես որ, մի քանի անգամ, ես վախենում եմ մի refactor- ի միջոցով, որը օգտագործում է շատ տոմսեր, քանի որ այն տպել է շատ ֆայլեր: Ես մի անգամ վերադառնալ եմ տոմսերի եւ մոռացել եմ GPT-OSS- ի սխալները եւ պետք է փոխել մի այլ IDE- ի համար, որպեսզի աշխատել: Պահպանություն: Երբ մեկ LLM- ը կախված է ձեր կոդը բազայի հետ, վերցնել այն, որը նախընտրաբար հաջողվել է: տարբեր մոդելները տարբեր են ձեր նախագծի բազանի «պահպանման» մասին: Եվ եթե դուք օգտագործում եք Antigravity- ը, երբ դուք կախված եք տոմսերի, դուք կարող եք փոխել MS Visual Code- ում նույն մոդելում եւ օգտագործել լայն GitHub Copilot հաշիվը Claude- ի հետ: Antigravity- ը հիմնված է Visual Code- ի վրա, այնպես որ դա աշխատում է շատ նման ձեւով: 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: Iterative խաղը Հաջորդ մի քանի շաբաթվա ընթացքում, ես աշխատել է կառուցել կայքը եւ փորձել / iterate բաղադրիչների, ես աշխատել է բազմաթիվ LLMs, ինչպես token limits reset. Claude- ը գերազանցվել է դիզայնային հարցերում եւ ստեղծել է Clean Website Code- ը Lightview- ի մասերի հետ Gemini Pro- ը միշտ փորձել է օգտագործել տեղական գործիքներ եւ shell- ի օգնության սրպտերներ, որպեսզի աջակցել իր աշխատանքի համար, որը արժե է արագության եւ token- ի արդյունավետության համար: Սակայն, երբեմն սխալ է, քանի որ շատ ֆայլերը կախված են, կամ կախված են, այլ ոչ մի ընտրություն, քան վերադառնալ. «Ես մի այլ LLM- ը ես»: «Ես մի այլ LLM- ը ես: Ի՞նչ եք մտածում?» -ը սովորաբար արտադրել է խոշոր տեսքներ կամ արագ վերահսկողություններ, որոնք մի LLM-ի վրա տեւում են: Ես գտնել եմ, որ իրական հաղթողը է Gemini Flash- ը: Դա անում է հիանալի աշխատանքը, որը տպագրում է կոդը, առանց տեղադրման սխալների, եւ պետք է տպագրություն տպագրել, թե ինչ կոդը տեղադրել, որտեղ: Երբեմն ես վախենում եմ փոխանցման մասին եւ ասում եմ այն: Երբեմն, Flash- ը հավատում է եւ կարգավորում է, եւ այլ անգամ այն պետք է ստեղծել իր ընտրության ռեժիմային ճշգրիտությունը: Եվ, խոսել արագ ... wow! Router- ի զարգացման մասին Արդյոք, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են այն, ինչպիսիք են: Հիմա This is entirely appropriate for a SPA — it’s simple, reliable, and doesn’t require server configuration. #/about #/docs Բայց ես ունեմ լրացուցիչ պահանջներ, որոնք ես չգիտեմ: Ես ուզում եմ ստանդարտ ճանապարհներ ( Հիմա Search engines կարող է վերահսկել hash routes այժմ, բայց path-based routing- ը դեռ ավելի գեղեցիկ է indexing- ի եւ share- ի համար: /about /docs Տեսագրություն: LLM- ները երբեք պետք է ստանալ ամենամեծ հարմարավետ լուծում: Hash-based routing- ը ավելի հեշտ է տեղադրել եւ աշխատում է առանց սերվերի կողմի konfiguration- ի: Քանի որ ես չգիտեմ, որ ես ուզում եմ path-based routing- ը, LLM- ը ընտրեց ավելի հեշտ մեթոդը: 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. When I told Claude I needed conventional paths for SEO and deep linking, it very rapidly rewrote the router and came up with what I consider a clever solution—a hybrid approach that makes the SPA pages both deep-linkable and SEO-indexable without the complexity of server-side rendering. However, it did leave some of the original code in place which kind of obscured what was going on and was totally un-needed. I had to tell it to remove this code which supported the vestiges of hash-based routes. This code retention is the kind of thing that can lead to slop. I suppose many people would blame the LLM, but if I had been clear to start with and also said “completely re-write”, my guess is the vestiges would not have existed. 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: 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. Պահպանություն: Ես նաեւ գտնել եմ, որ LLM-ները պաշտպանականորեն փորձում են ապահովել հարմարավետությունը նախորդ տարբերակների հետ, դա կարող է առաջացնել շատ հարմարավետ կոդը: Եթե դուք գրում եք ցածրից, դուք պետք է մոռացեք նրանց, որ վերադառնալով հարմարավետությունը չի պահանջվում: Տեսանյութեր Comparing the Numbers The Final Tally Project Size: 60 JavaScript ֆայլեր, 78 HTML ֆայլեր, 5 CSS ֆայլեր 41,405 միասնական կոդը գծեր (հարկվել են մեկնաբանություններ եւ գույքներ) Over 40 custom UI components 70+ կայքի ֆայլեր 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.75 կ lightview-x.js 1,251 20,2 կ Հիմնական հոդված՝ lightview-router.js 182 3K The website scored well on for performance without having had super focused optimization. component gallery Lighthouse But then came the complexity metrics. The Slop- ը բացահայտվել է Ես խնդրել եմ Gemini Flash- ից, որ սեղմել է կոդը, օգտագործելով երեք ձեւավոր մուտակներ: Մասնավոր մետրիկը, որտեղ 0- ը անպահեստելի է եւ 100- ը ճշգրտապես գրված է / clean code. The calculation considers: 1. Maintainability Index (MI): Halstead Volume (measure of code size and complexity) Cyclomatic ծախսերը Code գծեր Ինչ է Density Scores above 65 are considered healthy for library code. This metric gives you a single number to track code health over time. Պահպանված, բայց դեռ արժանի մետրիկը, որը մատակարարում է գինեականորեն անմիջական ճանապարհների համարը կոդը միջոցով: Բարձր cyclomatic complexity means: 2. Cyclomatic Complexity: More potential bugs Արդյոք, ավելի հեշտ է ստուգել ճշգրտությամբ (հարկե, մետրիկը կարող է ասում, թե ինչքան պետք է գրել) Բարձր բեռնվածությունը հասկանալով 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: Nested conditionals and loops (deeper nesting = higher penalty) Boolean օպերատորների ցանցեր Recursion Linear Flow- ի բաղադրիչները The thresholds: Clean Code - easy to understand and maintain 0-15: High Friction - refactoring suggested to reduce technical debt 16-25: 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 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 The Verdict Շնորհակալություն, որ առողջությունը լավ է: 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 ⚖️ Good Lightview-x.js Վիքիպահեստում 93 66.5 3.6 ️ Լավ 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 Cognitive Complexity: 🛑 35 Cyclomatic Complexity: 🛑 22 Maintainability Index: 33.9 (lightview-x.js): Anonymous Template Processing Հիմնական դասընթացը: 31 CYCLOMATIC համոզվածություն: 13 Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված -Ինչպե՞ս կարող եք վերահսկել իր ճշգրիտությունը: 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 Արդյո՞ք կոտրեք այն? 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 Critique Discovery #2: Gemini Flash «նշում» լայնորեն. Երբ վերլուծում է բոլոր իր դիզայնի գործընթացները պետք է կանգարեն, կարեւոր տեսքներ թռչել է IDE- ում. Երբ LLM- ը կարծում է, որ կանգարում է մի խոշորում, aborts եւ վերլուծում է պատմական բաները հնարավոր side-track- ի համար եւ ասում է, որ պետք է շարունակել կամ վերլուծել, քանի որ անհրաժեշտ է. Gemini Flash- ը լայնորեն «պատկում» է: Երբ վերահսկում է բոլոր իր դիզայնային գործընթացները, այն կախված է, կարեւոր տեսքները թռչվում են IDE- ում: Երբ LLM- ը կարծում է, որ պտուտակում է, սեղմում է եւ վերահսկում է պատմական զգացմունքները հնարավոր side-tracks- ի համար եւ ասում է, որ պետք է շարունակել կամ վերահսկել, քանի որ անհրաժեշտ է: Critical Discovery #2: Հիմնական հոդված՝ Fixes to , I asked for revised statistics to see the improvement. handleSrcAttribute Flash- ի թարմացումը Շնորհակալություն, Gemini Flash- ը կախված էր Դա պետք է վերլուծել ամբողջ 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/ 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/ Dev Dependencies-ի խնդիրը When I told Gemini to keep the metrics scripts permanently, another issue surfaced: it failed to officially install dev dependencies like (Տեսանյութի մասին JavaScript Parser) acorn Flash-ը պարզապես հավատում է, որ այն է, քանի որ գտնել է փաթեթներ Նրանք կարող են հեշտությամբ օգտագործել այն, ինչի համար was available was because I'd already installed a Markdown parser that depended on it. node_modules acorn Տեղադրություն: LLM-ները միշտ չեն կառավարում սխալները ճիշտ: Նրանք կարող են օգտագործել այն, ինչ հասանելի է 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 Պահպանություն: Երբ LLM- ը ստեղծում է գործիքային սերտիֆիկներ, որոնք օգտագործում են արտաքին փաթեթներ, բացառապես հարցրեք: «Ինչպե՞ս եք ավելացել 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: The Refactoring Results Flash-ը ցույց է տալիս, թե ինչպե՞ս է monolithic գործառույթը վերլուծվել կենտրոնացած օգուտների: Տեսակներ (լուսանկարներ: 5) Ապրանքներ (կամպիտակային: 5) (cognitive: 7) updateTargetContent (cognitive: 2) elementsFromSelector Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված The Results Metric Before After Improvement Cognitive Complexity 35 🛑 10 ✅ -71% Cyclomatic Complexity 22 7 -68% Status Critical Slop Clean Code — Cognitive Complexity 35 🛑 10 -71% Cyclomatic Complexity 22 7 -68% Status Critical Slop Clean Code — Հիմնական վերահսկողություն եւ ճշգրիտ կայքի փորձարկումը բացահայտել է սխալներ: Գինը: 0.5K բարձրությունը ֆայլերի չափը - անսահմանափակ. 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 transformerTextNode - template interpolation համար տեքստ - attribute interpolation and recursion transformElementNode Results: Function Group Previous Max New Max Status MutationObserver Logic 31 🛑 6 ✅ Clean domToElements Logic 12 ⚠️ 6 ✅ Clean MutationObserver Logic 31 🛑 6 Clean Հիմնական Logic 12 ☀️ 6 ✅ Սպիտակ Final Library Metrics Հետեւաբար, lightview-x.js- ը շատ ավելի լավ է: 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.4 / 25 ️ Լավ 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 1. LLMs Mirror Human Behavior—For Better and Worse LLMs exhibit the same tendencies as average developers: Rush to code without full understanding «Մենք չենք հավատում, որ կախված ենք, կամ պետք է արագ օգնել» Արդյոք, այնպես էլ, դուք կարող եք ստեղծել պաշտպանական, super-engineered լուծումներ, երբ պահանջվում է բարելավել հավասարությունը: Produce cleaner code with structure and frameworks The difference? They do it Նրանք կարող են արտադրել կղզիների կղզիները ժամերի ընթացքում, որոնք կարող են տեւել մարդկանց շաբաթ: faster and at greater volume 2. Քաղաքականություն օգնում է Բարձրացրած ռեժիմը (լուծվում է «նշելու» մեթոդներում) ցույց է տալիս տարբերակներ, ինքներդ վերահսկողություններ, եւ անմիջապես «Ես, բայց» օրինակներ: Դիտումը սովորաբար պակաս է, երբեմն պակաս է: Դիտեք, թե ինչ-որ բան եք անում, երբ դուք կարծում եք, որ գործառույթները սեղմվում են կամ կարեւոր են: LLM-ները չգիտեն, որ «Ես չգիտեմ» կամ «Ես խնդրում եմ մուտքագրել ինձ» - Ես ցանկանում եմ, որ նրանք ավելի սովորաբար: Դիտեք, թե ինչ պակաս է, եւ ստացեք պատասխանի պահանջը, եթե անհրաժեշտ է: Գիտեք, որ մտածել եւ վերահսկել կամ պարզապես ասում, որ շարունակեք, դուք Երկու հզորությունը շատ է When I told a second LLM, "You are a different LLM reviewing this code. What are your thoughts?", magic happened. Տեսագրություն: LLMs են բացառապես ոչ-դիմնական. Երբ հանդիպում է տեղադրման, որը վերլուծվում է, քանի որ շատ abstract, անսահմանափակ է abstract, կամ անսահմանափակ, առաջատար LLMs (Claude, Gemini, GPT) չի խոսում. Նրանք պետք է արագ, ճշգրիտ վերլուծություն եւ վերադառնալ հետ ճշգրիտ պրոն / պրոններ առաջադեմ vs փոխանցման վերլուծություններ. 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. Այս գործողությունը իրականում : beyond what most humans provide Ի՞նչն է, թե ինչու՞ն է, թե ինչու՞ն է, թե ինչու՞ն է, թե՞ն է, թե՞ն է, թե՞ն է, թե՞ն է, թե՞ն է, թե՞ն է, թե՞ն է: How many companies have experienced architects available for questioning by any developer at any time? Ինչպե՞ս կարող եք գրել, թե ինչու է անում ձեր 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. 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. 4. Պահպանեք բաղադրիչը Տեղադրել: Տեղադրել LLM- ը օգտագործելու համար «Vanilla JavaScript- ը» առանց սահմանափակումներով կանգնած է. Vanilla JavaScript- ը մի գեղեցիկ, բայց ինքներդ լուսավոր լեզու է, որտեղ ժամանակին լուսավոր կամ անսահմանափակ բեռնել API- ը բացահայտվում է: Չնայած սահմանափակումներ, հեշտ է ստեղծել անսահմանափակ code- ը, ինչպիսիք են մարդկանց եւ LLM-ների համար: Տեղադրելով սարքավորումներ (Bau.js, React, Vue, Svelte, եւ այլն) ապահովում է վահանակներ, որոնք առաջանում են ավելի գեղեցիկ, ավելի պահպանված կոդը: Վինիլա JavaScript- ը մի գեղեցիկ, բայց բաղկացած լեզու է, որտեղ մի երբեմն բաղկացած կամ անսահմանափակ Browser API- ը բացահայտվում է: Չնայած բաղկացածները, հեշտ է ստեղծել անսահմանափակ code- ը, ինչպիսիք են մարդկանց եւ LLM-ների համար: Սպիտակել սարքավորումներ (Bau.js, React, Vue, Svelte, եւ այլն) ապահովում է վահանակներ, որոնք առաջանում են ավելի գեղեցիկ, ավելի բաղկացած կոդը: Finding: Պաշտպանություն: Երբ սկսում եք մի նախագծ, այն մասին, ինչ դուք ցանկանում եք կատարել, խնդրում ենք օգնել: The framework/ library to use (Անհարկե, Vue, Svelte, եւ այլն) Արդյունաբերական մոդելը (MVC, MVVM, component-based եւ այլն) Code Organization Preferences (պատեգորիաների վրա հիմնված vs. մակերեսի վրա հիմնված փաթեթներ) Naming conventions Whether to use TypeScript or JSDoc for type safety Արդյոք, թե ինչու պետք է օգտագործել... ոչ մի խոստովանություն, թե ինչու պետք է վերադառնալ. «Մենք պետք է ասում ենք, որ մենք կարող ենք ստեղծել մի React ծրագրը, որը օգտագործում է գործառույթային մասեր, կոճակներ, TypeScript- ը եւ գործառույթների վրա հիմնված ֆայլերը»: Ավելի շատ կառուցվածքը, ինչպիսիք եք ապահովում, այնքան քիչ կախվածություն ստանում եք. Սա կիրառվում է բոլոր լեզուների համար, ոչ միայն JavaScript- ում: When starting a project, based on what you want to accomplish ask for advice on: Guidance: The framework/ library to use (Անհարկե, Vue, Svelte, եւ այլն) Արդյունաբերական մոդելը (MVC, MVVM, component-based եւ այլն) Code Organization Preferences (պատեգորիաների վրա հիմնված vs. մակերեսի վրա հիմնված փաթեթներ) Naming conventions Ինչպես օգտագործել TypeScript- ը կամ JSDoc- ը տպային անվտանգության համար Արդյոք, թե ինչու պետք է օգտագործել... ոչ մի խոստովանություն, թե ինչու պետք է վերադառնալ. «Մենք պետք է ասում ենք, որ մենք կարող ենք ստեղծել մի React ծրագրը, որը օգտագործում է գործառույթային մասեր, կոճակներ, TypeScript- ը եւ գործառույթների վրա հիմնված ֆայլերը»: 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 I love that formal software metrics can guide LLM development. They're often considered too dull, mechanical, difficult or costly to obtain for human development, but in an LLM-enhanced IDE with an LLM that can write code to do formal source analysis (no need for an IDE plugin subscription), they should get far more attention than they do. Տեսագրություն: Formal software metrics can guide development objectively.They are perfect for: Identifying technical debt automatically Tracking code health over time Guiding refactoring priorities Validating that "improvements" actually improve things Տեսագրություն: Formal software metrics can guide development objectively.They are perfect for: Identifying technical debt automatically Tracking code health over time Guiding refactoring priorities Հիմնական հոդված՝ «Տեսանյութը» իրականում բարելավում է Metrics don't lie. They identified the slop my intuition missed. 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: 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: Միացեք մետրիկները ձեր LLM աշխատանքային արագության մեջ: Guidance: Run complexity metrics on all files. Identify functions with cognitive complexity > 15 or cyclomatic complexity > 10. After initial implementation: Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված՝ Հիմնական հոդված: Խնդրում ենք հավելելել, որ «Refactor handleSrcAttribute to reduce cognitive complexity to target range». 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: Հեղինակ՝ Verdict After 40,000 lines of LLM-generated code, I'm cautiously optimistic. But like human developers, they need: Yes, LLMs can generate quality code. Clear, detailed specifications Structural constraints (frameworks, patterns) Պահպանելու վերահսկողություն Objective quality measurements Multiple perspectives on architectural decisions 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 Արդյոք, ինչ կարող է տեւել մարդային թիմի ամիսներ կառուցելու եւ վերահսկողության, LLMs կարող է կատարել ժամերի ընթացքում: Հեռախոսային աշխատանքը դեռ է, բայց առաջին արտադրությունը արագ է արագանում: Հիմնական տեսքը 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. Այստեղ է այն, ինչ փոխվել է: Feedback loop-ը կտրված է շաբաթից ժամերին: We can now iterate and clean up faster when requirements evolve or prove insufficient. Քանի որ coding միջավայք զարգանում են փաթեթել LLMs ավելի լավ կառուցվածքը - ավտոմատ մետրիկներ, պահանջված մոդելներ, multi-model reviews - որակի պետք է բարելավվի. Մենք դեռ չենք այնտեղ, բայց հիմնադրամը հուսալի է: Հիմնական հարցը չէ, թե LLM-ները կարող են արտադրել որակի կոդը: Դա այն է, թե ինչպես մենք կարող ենք ապահովել նրանց - եւ մեզ հետ - սխալը, որպեսզի այն անում ենք միասին: 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? Given its late entry into the game and the anchoring LLMs already have, I don’t hold high hopes for the adoption of Lightview, but it was an interesting experiment. You can visit the project at: https://lightview.dev
