technology-stack
Provides architectural standards and technology selection rules for working within the AG Grid codebase.
Install
mkdir -p .claude/skills/technology-stack && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/1640" && unzip -o skill.zip -d .claude/skills/technology-stack && rm skill.zipInstalls to .claude/skills/technology-stack
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Technology choices and architectural constraints for AG Grid. Use when choosing technologies, adding dependencies, or understanding zero-dependency requirements.Key capabilities
- →Enforces zero-dependency guidelines
- →Validates architectural standards
- →Selects compatible build system components
- →Monitors adherence to framework-agnostic core design
How it works
Checks proposed changes against a strict inventory of allowed technologies and architectural constraints.
Inputs & outputs
When to use technology-stack
- →Checking dependency requirements
- →Selecting build tools
- →Reviewing architectural standards
- →Verifying test framework usage
About this skill
Technology Stack
This document outlines the technology choices and constraints for the AG Grid codebase.
Core Principles
Zero Runtime Dependencies
The main AG Grid libraries (ag-grid-community, ag-grid-enterprise) must have ZERO third-party runtime dependencies. This ensures:
- Minimal bundle size for end users
- No dependency conflicts
- Complete control over behaviour
- Predictable performance characteristics
Framework Agnostic Core
The core grid logic is framework-agnostic. Framework-specific wrappers (ag-grid-react, ag-grid-angular, ag-grid-vue3) provide integrations while the core remains pure TypeScript.
Build System
- Nx: Monorepo orchestration and build caching
- Yarn: Package management (v1.x)
- TypeScript: Strict mode enabled across all packages
- ESBuild/Rollup: Bundle generation
Runtime Technologies
Rendering
- Virtual DOM: Custom high-performance rendering engine
- CSS-in-JS: Avoided - use CSS modules and traditional stylesheets
- Canvas: Used only for specific features (e.g., sparklines)
State Management
- Custom internal state management - no external libraries
Testing Technologies
- Vitest: Unit, integration, and behavioural testing (
testing/angular-testsstill uses Jest) - Playwright: E2E testing, and the default engine for behavioural benchmarks (
./benches.sh) - jsdom: DOM simulation for unit tests
Code Style
- ESLint: Linting with custom rules
- Prettier: Code formatting (via
yarn nx format --sort-root-tsconfig-paths=false) - TypeScript Strict Mode: Enforced across all packages
Browser Support
- Modern browsers only (ES2020 target)
- No IE11 support
- See browserslist configuration for specifics
Documentation
- Astro: Static site generation for documentation
- MDX/Markdoc: Documentation content format
When not to use it
- →Projects requiring third-party runtime libraries
- →Rapid prototyping outside of core grid development
Limitations
- →Limited flexibility for rapid third-party integration
- →Strict compliance requirements for all new code
How it compares
Prioritizes minimal bundle size and platform stability over ease of external integration.
Compared to similar skills
technology-stack side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| technology-stack (this skill) | 3 | 3mo | No flags | Intermediate |
| Feature Development | 0 | 5mo | No flags | Intermediate |
| accessibility-compliance | 45 | 2mo | No flags | Intermediate |
| angular-best-practices | 21 | 3mo | No flags | Advanced |
Try saying
Example prompts that trigger this skill in your AI assistant.
You might also like
Feature Development
RunAnyDev
Guidelines and best practices for creating new features in the application.
accessibility-compliance
wshobson
Implement WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, implementing ARIA patterns, building for screen readers, or ensuring inclusive user experiences.
angular-best-practices
sickn33
Angular performance optimization and best practices guide. Use when writing, reviewing, or refactoring Angular code for optimal performance, bundle size, and rendering efficiency.
typescript
lobehub
TypeScript code style and optimization guidelines. Use when writing TypeScript code (.ts, .tsx, .mts files), reviewing code quality, or implementing type-safe patterns. Triggers on TypeScript development, type safety questions, or code style discussions.
nextjs-best-practices
davila7
Next.js App Router principles. Server Components, data fetching, routing patterns.
frontend-code-review
langgenius
Trigger when the user requests a review of frontend files (e.g., `.tsx`, `.ts`, `.js`). Support both pending-change reviews and focused file reviews while applying the checklist rules.