Wat Agnes begrijpt, en wat nog niet
Agnes analyseert de broncode van je repository zonder die uit te voeren, dus wat gecontroleerd kan worden hangt af van de bestanden en conventies van je framework. Deze pagina laat zien waar de dekking volledig is, waar die gedeeltelijk is en wat nog ontbreekt.
Dekking per framework
De dependency-controles werken voor elk framework, omdat ze je lockfile lezen. De andere controles hangen af van de bestanden en conventies van het framework.
| Framework | Dependencies & securityAdvisories, licenties, secrets | CodekwaliteitLinting, duplicatie, complexiteit | Templates & stijlenMarkup en CSS | Dode codeOngebruikte bestanden en exports | ToegankelijkheidOptioneel per project |
|---|---|---|---|---|---|
| HTML, CSS and JavaScript | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| React (Vite, Create React App) | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| Next.js | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| TanStack Start | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| React Router and Remix | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| Solid, Qwik and Preact | Ondersteund | Gedeeltelijk | Ondersteund | Gedeeltelijk | Gedeeltelijk |
| Vue | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| Nuxt | Ondersteund | Ondersteund | Ondersteund | Gedeeltelijk | Ondersteund |
| Svelte | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| SvelteKit | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| Astro | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
| Angular | Ondersteund | Ondersteund | Ondersteund | Ondersteund | Ondersteund |
Ondersteund betekent dat de controle draait en de conventies van het framework kent. Gedeeltelijk betekent dat hij draait met de beperkingen hieronder. Nog niet betekent dat de controle voor dat framework wordt overgeslagen.
Goed om te weten
Frameworks met een beperking, of een conventie die uitleg verdient.
TanStack Start
Routes en de gegenereerde routeboom tellen als entrypoints, dus routebestanden worden nooit als ongebruikt gemeld. De eigen packages van het framework worden niet op ongebruik gecontroleerd.
React Router and Remix
De routes in de app-map en de bestanden die in routes.ts worden genoemd tellen als entrypoints. routes.ts wordt als tekst gelezen en nooit uitgevoerd, dus bij routes die met code worden opgebouwd, zoals lussen of hulpfuncties, kunnen de bestanden als ongebruikt worden gemeld.
Solid, Qwik and Preact
Geanalyseerd als gewone TypeScript en JSX. We hebben deze frameworks niet specifiek getest, dus React-specifieke regels kunnen dingen aanmerken die hier prima zijn, en de resultaten voor dode code hangen af van een index.html of een entrypoint in package.json.
Vue
Naast de code- en templatecontroles meldt Agnes props die een component wijzigt, refs zonder .value en v-html (een securitybevinding om na te kijken). Stijlblokken worden gelint, ongeacht hun lang. Vue 2-deprecatiewaarschuwingen blijven buiten beschouwing.
Nuxt
Pagina's, layouts, middleware, plugins en servercode tellen als entrypoints. De mappen components, composables, utils en stores ook, omdat Nuxt die automatisch importeert. Ongebruikte code in die mappen wordt dus niet gemeld.
Svelte
De eigen reactiviteitswaarschuwingen en waarschuwingen over ongebruikte stijlen van de Svelte-compiler worden gemeld, plus eslint-plugin-svelte-regels zoals ontbrekende each-keys en {@html} (een securitybevinding om na te kijken). De regel die elke interne link aanmerkt omdat resolve() niet wordt gebruikt, is weggelaten omdat hij te veel ruis geeft.
Astro
Pagina's zijn entrypoints en componenten worden gecontroleerd op scripts, templates en stijlen. De toegankelijkheidscontroles voor Astro betreffen de templates.
Angular
TypeScript, templates en inline templates worden gecontroleerd met de aanbevolen lintregels van Angular, en componentstijlen worden gelint zoals elke andere stylesheet (::ng-deep, :host en :host-context worden begrepen). Inline stijlen in de component-decorator worden niet gelint. Templates worden gevonden via de templateUrl van elke component, dus bestandsnamen doen er niet toe.
Bekende hiaten
Deze gelden niet voor één framework. We noemen ze zodat je weet wat een goede score wel en niet zegt.
Stylus
Stylus-bestanden worden niet geanalyseerd. De enige beschikbare parser voor Stylus wordt niet meer onderhouden en leest gewone Stylus-syntax verkeerd. SCSS, Sass en Less worden gelint, met de standaardregels voor CSS en SCSS.
Onderhoudbaarheidsscore van componentscripts
De cognitieve complexiteit wordt gemeten in de scripts van .vue-, .svelte- en .astro-bestanden, maar de onderhoudbaarheidsscore per bestand leest alleen JavaScript- en TypeScript-bestanden.
Een lockfile is nodig
De controles op dependencies, advisories en licenties lezen package-lock.json, yarn.lock, pnpm-lock.yaml of bun.lock, en de advisorycontrole leest ook composer.lock. Zonder lockfile blijft dat deel van de score weg.
npm, plus Composer-advisories
Composer-packages worden op bekende advisories gecontroleerd, maar niet op verouderde of deprecated versies of op hun licenties. Dependencies uit andere ecosystemen, of uit Deno, worden niet gecontroleerd.
Je eigen lintconfig wordt niet gelezen
Agnes draait haar tools met eigen regels in een sandbox en voert je configbestanden nooit uit, dus projectspecifieke ESLint-, Biome- of Stylelint-regels veranderen het rapport niet.
Vooral frontend-repositories
Minstens 60% van de regels broncode moet frontendcode zijn. Een monorepo met veel backendcode kan daaronder vallen en wordt dan niet geanalyseerd. Templates (Blade, Twig, Nunjucks, Handlebars, Liquid, MDX) tellen aan geen van beide kanten mee, dus de Blade-views van een Laravel-app trekken die er niet onder.
Wat telt als frontend-repository
Agnes telt de regels in HTML-, CSS- (inclusief SCSS, Sass en Less), JavaScript-, TypeScript-, Vue-, Svelte- en Astro-bestanden en analyseert een repository als minstens 60% van de regels broncode in deze talen staat. Gegenereerde en meegeleverde mappen zoals node_modules, dist, .next, .nuxt, .svelte-kit en .astro worden genegeerd.
De controles komen van open-source tools. Zie welke dat zijn, en waar ze aan bijdragen, op de pagina Tools