Vue (general) implementation checklist

Verify all non-initial routes in the Vue Router configuration use dynamic imports to reduce the main bundle size.

Run a production build and use a bundle visualizer to ensure that unused components and heavy libraries are not included in the final assets.

Wrap heavy third-party components (e.g., charts, editors) in 'defineAsyncComponent' to defer loading until they are rendered.

Configure Vite plugins to compress static assets and ensure responsive image sets are used for high-resolution displays.

Implement link prefetching for high-probability navigation paths using the browser's idle time.

Integrate 'vue-tsc --noEmit' into the CI/CD pipeline to catch template-level type errors that 'tsc' ignores.

Ensure all components use generic 'defineProps' and 'defineEmits' interfaces rather than runtime-only declarations.

Verify all DOM and component refs are strictly typed (e.g., ref<HTMLButtonElement | null>(null)) to prevent runtime null pointers.

Enable 'strict: true' and 'noImplicitAny' in tsconfig.json to ensure full coverage across the codebase.

Apply Zod or similar schema validation to API responses before casting them to TypeScript interfaces.

Audit all store usage to ensure 'storeToRefs' is used when destructuring state to avoid losing reactivity.

Enforce a pattern where state is only modified through actions to ensure updates are traceable in DevTools.

Manually unsubscribe from store '$subscribe' or '$onAction' listeners in the 'onUnmounted' hook if they are created outside of setup.

Implement and call a '$reset' method for all user-related stores during the logout flow to prevent data leakage.

Verify that any state persisted to LocalStorage is versioned and cleared if the schema changes.

Configure 'app.config.errorHandler' to pipe runtime errors to a monitoring service like Sentry or LogRocket.

Wrap high-risk components (e.g., third-party widgets) in parent components using the 'onErrorCaptured' hook.

Ensure every network request has a corresponding loading state and a user-facing error message for 4xx/5xx responses.

Verify that manually created 'watch' or 'effect' calls have their stop handles invoked to prevent memory leaks.

Confirm that only non-sensitive variables are prefixed with 'VITE_' and that secrets are never committed to the repository.

Verify that business logic extracted into composables has 100% test coverage using Vitest.

Test critical UI components using Vue Test Utils to verify correct event emission and prop rendering.

Execute Playwright or Cypress tests for the primary user flows (login, checkout, profile updates).

Run an automated accessibility scanner (e.g., axe-core) to check for missing ARIA labels and low contrast ratios.

Run 'eslint --ext .js,.vue' and 'prettier --check' to ensure code consistency and prevent common syntax anti-patterns.