Skip to main content

2 posts tagged with "performance"

View All Tags

· 4 min read

Overview:

I'm excited to announce the release of Angular Agent Kit - a collection of AI coding agent skills designed specifically for Angular developers. This toolkit extends the capabilities of AI coding assistants like GitHub Copilot, Claude Code, Cursor, and Gemini CLI with deep Angular expertise.

What is Angular Agent Kit?

Angular Agent Kit is a collection of skills that follow the Agent Skills specification. These skills are packaged instructions and scripts that extend AI agent capabilities, enabling them to provide expert-level guidance on Angular development.

The Problem It Solves

As Angular applications grow in complexity, maintaining performance becomes increasingly challenging. Developers often struggle with:

  • Change detection optimization - Understanding when to use OnPush strategy
  • Bundle size management - Identifying and eliminating bloat
  • Template performance - Writing efficient templates that don't cause unnecessary re-renders
  • RxJS patterns - Avoiding memory leaks and implementing efficient async operations

While AI coding assistants are powerful, they sometimes lack the specialized Angular knowledge needed to provide optimal recommendations. Angular Agent Kit bridges this gap.

Available Skills

angular-best-practices

The flagship skill contains 45+ rules across 8 categories, prioritized by their impact on application performance:

CategoryPriority
Change DetectionCritical
Bundle Size OptimizationCritical
Template PerformanceHigh
RxJS & Async OperationsHigh
Component ArchitectureMedium-High
HTTP & Data FetchingMedium
Forms & ValidationMedium
Testing & DebuggingLow-Medium

Installation

Getting started is simple with a single command:

npx skills add sajeetharan/angular-agent-kit

Usage Examples

Once installed, skills are automatically available. Simply ask your AI assistant:

Review my Angular component for performance issues
Help me optimize change detection in this component
Optimize this Angular template for better performance

The AI agent will automatically leverage the Angular best practices rules to provide expert-level recommendations.

Compatibility

Angular Agent Kit works with all major AI coding tools:

  • GitHub Copilot - Works seamlessly in VS Code
  • Claude Code - Full support for Claude's coding assistant
  • Cursor - Enhanced Angular development experience
  • Gemini CLI - Google's AI coding assistant
  • Any other Agent Skills-compatible tools

Skill Structure

Each skill in the kit follows a consistent structure:

  • SKILL.md - Instructions that trigger skill activation
  • AGENTS.md - Compiled rules that agents read
  • rules/ - Individual rule files for easy maintenance
  • metadata.json - Version and metadata information

Why I Built This

As someone who works extensively with Angular and AI development tools, I noticed a gap between generic AI coding assistance and Angular-specific expertise. The rules in this kit are distilled from years of Angular development experience, official Angular documentation, and community best practices.

Acknowledgments

This project was inspired by:

Contributing

Contributions are welcome! If you have Angular best practices that should be included, or improvements to existing rules, please check out the CONTRIBUTING.md file for guidelines.

Get Started Today

Ready to supercharge your Angular development with AI-powered best practices?

  1. Install the skill: npx skills add sajeetharan/angular-agent-kit
  2. Open your Angular project
  3. Ask your AI assistant for Angular optimization help

Check out the GitHub repository for more details and to star the project if you find it useful!


Have questions or feedback? Feel free to open an issue on GitHub or reach out to me on Twitter!

· 2 min read

I was checking out this cool feature on the Azure Portal Today. I usually spent 3 hours per week on evaluating the new features or building something new on Azure. Azure Portal is for a lot of developers is the go-to place to manage all their Azure resources and services. Most often i hear from the developers is that Portal takes much time to load when you login and sometimes we feel that portal is slow. Today i figured out a way to debug the portal loading time. If you are developer who considers Azure Portal as your website and want to know about the duration for each view of the page, while you are logged in into the Azure Portal and press the keyboard shortcut CTRL + ALT + D you can see the load time and other useful information for every title.

Azure Portal Load Time

You can simply enable/disable certain features on the portal by toggling the Experiments. You can also enable Debug Hub to see if there are any exceptions/issues while loading the portal related elements.

Enable/Disable certain features

One other tip i would like to highlight here is that keyboard shortcuts that you can use specifically for the Azure portal.

To see them all, you can open the Keyboard shortcut help item in the Help Menu on the top-right of the Portal.

Shortcut keys

Hope it helps you to figure out if there is a slowness while loading the Azure Portal. If you are new to Azure and want to get start on Azure, explore my tool Azure360. Share this tip with your colleagues.