bee:dev-frontend-performance-vuejs

Validate Vue.js frontend performance against Core Web Vitals and Lighthouse score.

2|1|Updated Mar 3, 2026

Search Tags:#performance #frontend #bundle size #lighthouse #vuejs #core web vitals #nuxt3

Ready to run

npx skills add https://github.com/luanrodrigues/ia-frmwrk --skill bee-dev-frontend-performance-vuejs

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: bee:dev-frontend-performance-vuejs
Source: https://github.com/luanrodrigues/ia-frmwrk/tree/main/dev-team/skills/dev-frontend-performance-vuejs
Command: npx skills add https://github.com/luanrodrigues/ia-frmwrk --skill bee-dev-frontend-performance-vuejs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill ensures Vue.js frontend applications meet critical performance benchmarks, preventing slow load times and poor user experiences.

Core Features & Use Cases

Core Web Vitals Compliance: Validates LCP, CLS, and INP scores against defined thresholds.
Lighthouse Performance Audits: Ensures a Lighthouse performance score of 90 or higher.
Bundle Size Optimization: Monitors and controls the growth of JavaScript bundle sizes.
Nuxt 3 Optimization Verification: Checks for correct usage of performance-enhancing Nuxt 3 features like useAsyncData, useLazyFetch, and NuxtImg.
Use Case: After implementing new features in a Nuxt 3 application, this Skill automatically runs performance tests to confirm that the changes haven't negatively impacted user experience or introduced performance regressions before code review.

Quick Start

Run the bee:dev-frontend-performance-vuejs skill to validate the performance of the latest Vue.js frontend code.

Frequently Asked Questions about bee:dev-frontend-performance-vuejs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I validate Core Web Vitals compliance for my Vue.js application?▼

To validate Core Web Vitals compliance for a Vue.js application, this tool audits LCP, CLS, and INP scores against defined thresholds to prevent slow load times and ensure a good user experience.

How do I check if my Nuxt 3 useAsyncData and useLazyFetch implementations are optimized?▼

You can check Nuxt 3 optimization by auditing the correct usage of performance-enhancing features like useAsyncData, useLazyFetch, and NuxtImg to verify they are implemented correctly.

Can I automatically run a Lighthouse performance audit before code review?▼

Yes, you can automatically run Lighthouse performance audits before code review to ensure your Vue.js frontend maintains a performance score of 90 or higher after new features are implemented.

How do I monitor and control JavaScript bundle size growth in a Vue.js project?▼

You monitor JavaScript bundle size in a Vue.js project by setting a bundle size budget, which automatically checks that new code changes do not exceed the defined limits and cause performance regressions.

What is the best way to prevent frontend performance regressions in a Nuxt 3 application?▼

The best way to prevent frontend performance regressions in a Nuxt 3 application is to run automated checks that validate Core Web Vitals, Lighthouse scores, and Nuxt 3 feature optimizations after implementing new features.