AI Skill Report Card
Analyzing JavaScript Errors
Analyzing JavaScript Errors
Analyze error patterns from monitoring dashboards to identify root causes and provide actionable solutions.
Quick Start15 / 15
Input: Error log with occurrence count and stack trace
457 occurrences: unhandledrejection @https://ucmp-static.sf-express.com/v1/we/cxmodules/static/js/async-page-module510.e0e94397.chunk.js:1:12790
Output:
Error Type: Unhandled Promise Rejection
Root Cause: Async operation failure in code-split module
Priority: HIGH (457 occurrences)
Fix: Add proper error handling to async operations in module510
Recommendation▾
Streamline the workflow section - combine classification and analysis steps into a single checklist rather than separate detailed breakdowns
Workflow12 / 15
Progress:
- Categorize errors by type and frequency
- Identify critical vs non-critical issues
- Analyze stack traces for root causes
- Prioritize fixes by impact
- Generate specific recommendations
Error Classification
-
Critical Errors (>100 occurrences)
- ChunkLoadError: Resource loading failures
- unhandledrejection: Async operation failures
- TypeError: Missing function/variable references
-
Medium Priority (10-100 occurrences)
- Config failures
- API call errors
- Session timeouts
-
Low Priority (<10 occurrences)
- Environment-specific errors
- Edge case failures
Analysis Steps
-
Pattern Recognition
- Group similar error messages
- Identify common URLs/modules
- Note error frequency trends
-
Root Cause Analysis
- Examine stack traces
- Check resource availability
- Identify code paths
-
Impact Assessment
- User count affected
- Business function impact
- Error frequency
Recommendation▾
Reduce redundancy between 'Best Practices' and 'Common Pitfalls' sections - merge overlapping advice
Examples18 / 20
Example 1:
Input: 224 occurrences, ChunkLoadError https://ucmp.sf-express.com/v1/we/cxmodules/microservice-order
Output:
Issue: JavaScript bundle loading failure
Cause: CDN/network issues or missing chunk files
Solution: Implement chunk loading retry mechanism and fallback resources
Priority: HIGH - affects order functionality for 212 users
Example 2:
Input: 396 occurrences, unhandledrejection {"errCode":"-2","errMessage":"不存在APP事件调用通道"}
Output:
Issue: Mobile app bridge communication failure
Cause: Missing or incompatible app event channel
Solution: Add feature detection and graceful degradation
Priority: HIGH - affects 216 users on mobile
Recommendation▾
Add one more concrete example showing the complete analysis workflow for a different error type (e.g., TypeError with actual stack trace)
Best Practices
- Prioritize by user impact: Errors affecting core functionality first
- Focus on patterns: Group similar errors before analyzing individually
- Check environment context: Mobile vs web, version-specific issues
- Provide specific fixes: Code changes, configuration updates, or infrastructure fixes
- Include prevention: How to avoid similar issues
Common Pitfalls
- Don't analyze every single error - focus on high-frequency patterns
- Don't ignore low-occurrence errors that affect critical paths
- Don't assume all ChunkLoadErrors are network issues - check file existence
- Don't overlook environment-specific problems (browser compatibility)
- Don't provide generic solutions - be specific to the error context
Error Categories Reference
ChunkLoadError: JavaScript bundle loading failures
- Check CDN availability
- Verify file paths and versions
- Implement retry logic
unhandledrejection: Uncaught promise rejections
- Add .catch() handlers
- Implement global error boundaries
- Log for debugging
TypeError: Missing functions/variables
- Check object existence before access
- Verify API contracts
- Add type guards
Config/Auth errors: Integration failures
- Verify service availability
- Check authentication tokens
- Implement fallback mechanisms