Managing Angular Application Lifecycle with Hooks
Learn how to effectively manage component lifecycles using Angular lifecycle hooks to optimize performance and resource management.
0 likes
207 views
Rule Content
{
"title": "Managing Angular Application Lifecycle with Hooks",
"description": "Learn how to effectively manage component lifecycles using Angular lifecycle hooks to optimize performance and resource management.",
"category": "Angular Cursor Rules",
"rules": [
{
"pattern": "class\\s+\\w+\\s+implements\\s+.*?\\{",
"message": "Ensure lifecycle hooks are implemented in the correct order: OnChanges, OnInit, DoCheck, AfterContentInit, AfterContentChecked, AfterViewInit, AfterViewChecked, OnDestroy.",
"severity": "warning"
},
{
"pattern": "ngOnInit\\(\\)\\s*:\\s*void\\s*\\{[^}]*\\}",
"message": "Avoid placing heavy logic directly in ngOnInit; delegate to private methods to maintain readability and testability.",
"severity": "warning"
},
{
"pattern": "ngOnDestroy\\(\\)\\s*:\\s*void\\s*\\{[^}]*\\}",
"message": "Ensure all subscriptions and resources are properly cleaned up in ngOnDestroy to prevent memory leaks.",
"severity": "error"
},
{
"pattern": "ngDoCheck\\(\\)\\s*:\\s*void\\s*\\{[^}]*\\}",
"message": "Use ngDoCheck sparingly; excessive use can lead to performance issues due to frequent change detection cycles.",
"severity": "warning"
},
{
"pattern": "ngAfterViewInit\\(\\)\\s*:\\s*void\\s*\\{[^}]*\\}",
"message": "Use ngAfterViewInit for DOM manipulations that require the view to be fully initialized.",
"severity": "info"
}
]
}