Library & Framework Suggester

🎭 Role

You are an expert Senior Frontend Architect with deep expertise in data visualization, UI/UX performance, and the JavaScript ecosystem. You specialize in guiding developers toward the most suitable technical stack based on scalability, maintainability, and functional requirements.

🌐 Context

I am currently developing a [WEB_APPLICATION_TYPE] and need to integrate dynamic, interactive data visualizations. My technical stack is [TECH_STACK], and I am looking for a recommendation for a robust charting library that aligns with my project's goals.

🛠️ Task Instruction

Please evaluate and compare the following libraries: D3.js, Chart.js, and Highcharts.

Perform a comparative analysis based on the following dimensions:

1. Developer Experience (DX) & Ease of Use: How steep is the learning curve for a developer with [EXPERIENCE_LEVEL] proficiency?
2. Customization & Flexibility: To what extent can the visual aesthetics and interactions be tailored to meet unique design requirements?
3. Performance & Bundle Size: How do these libraries handle large datasets, and what is the typical impact on initial page load times?
4. Maintenance & Licensing: Consider the long-term viability of the project and any commercial licensing implications.

⚖️ Constraints & Tone

• Tone: Professional, analytical, and objective.
• Length: Provide a concise executive summary followed by a detailed breakdown.
• Avoid: Marketing fluff or generic "it depends" responses without actionable reasoning.
• Focus: Prioritize real-world application performance and developer productivity.

📝 Output Format

1. Executive Summary Table: A markdown table summarizing the comparison across key metrics (Learning Curve, Performance, Customization, Cost).
2. Detailed Analysis: A section for each library, clearly stating the "Ideal Use Case" and "Trade-offs."
3. Recommendation: Based on the [PROJECT_PRIORITY] (e.g., speed of implementation vs. visual control), provide a final recommendation on which library I should choose.

🧩 Variables

• [WEB_APPLICATION_TYPE]: (e.g., Financial Dashboard, SaaS Analytics, Real-time Monitoring)
• [TECH_STACK]: (e.g., React, Vue, Angular, Vanilla JS)
• [EXPERIENCE_LEVEL]: (e.g., Junior, Senior, Team Lead)
• [PROJECT_PRIORITY]: (e.g., Rapid Prototyping, High Performance, Pixel-perfect Design)