Release v3.0: Settings, Dark Mode, and Export

🎉 Version 3.0 - Major Feature Release

This is a major update with highly requested features! v3.0 adds a full settings page, dark mode, export functionality, and lays the groundwork for future data sharing capabilities.

🌟 What's New

⚙️ Settings Page

Access via the gear icon in the popup, or right-click the extension → Options

• Dark Mode Toggle - Beautiful dark theme throughout the extension
• History Limit - Choose how many analyses to store (5, 10, 25, 50, 100, or unlimited)
• Notifications - Control desktop notifications for analysis completion
• Data Sharing - Opt-in for anonymous data sharing (UI ready, backend coming in v3.1)
• Export Settings - Download your preferences as JSON
• Reset to Defaults - One-click restoration of default settings

🌙 Dark Mode

• CSS variable-based theming system
• Smooth theme transitions
• Syncs automatically between popup and settings
• Persists your preference across sessions
• Works throughout the entire extension

📤 Export Functionality

After analyzing a page, export your results in 3 formats:

• JSON - Structured data perfect for developers and automation
• CSV - Import into Excel, Google Sheets, or any spreadsheet
• Markdown - Ready-to-paste documentation with formatting

Each export includes:

• URL and page title
• Timestamp
• Render type and confidence
• All detection indicators
• SSR/CSR scores
• Detected frameworks
• Performance metrics

🔒 Privacy-First Data Sharing (v3.1 Preview)

• Clear explanation of what data would be shared
• Fully GDPR-compliant UI
• Currently logs to console (actual backend in v3.1)
• Helps build a database of rendering patterns across the web

🎨 UI Improvements

• Settings Gear Icon - Easy access to options from the popup
• Export Buttons - Appear after analysis with clear labels
• Better Visual Hierarchy - Improved layout and spacing
• Theme Compatibility - All elements work in both light and dark mode
• Smooth Animations - Loading states adapt to your theme

🔧 Technical Details

Files Added:

• options.html - Full-featured settings page (320 lines)
• options.js - Settings management and persistence (125 lines)

Files Modified:

• manifest.json - Added options_page, version 3.0
• popup.html - New header with settings button, export buttons, dark mode support
• popup.js - Complete rewrite (433 lines) with dark mode, export, settings integration
• README.md - Updated features list for v3.0
• CHANGELOG.md - Comprehensive v3.0 entry

APIs Used:

• chrome.storage.sync - Settings persistence across devices
• chrome.runtime.sendMessage - Communication between pages
• Blob API - File downloads
• CSS Custom Properties - Theming system

📊 Statistics

• 7 files changed
• 1,029 additions
• 133 deletions
• 2 new files created

🚀 Getting Started

1. Update the extension from Chrome Web Store (or reload if installed locally)
2. Click the gear icon in the popup to access settings
3. Try dark mode - Toggle and see the instant theme switch
4. Analyze a page - Then click any export button to download results
5. Customize - Set your preferred history limit and notification settings

🔮 What's Next (v3.1)

• Backend API for anonymous data collection
• Public dashboard showing global rendering statistics
• Framework popularity trends
• URL lookup cache (see what others detected)

🐛 Bug Fixes

• Fixed error handling when settings page sends messages to closed popup
• Improved theme transition smoothness
• Better error messages for export failures

📦 Installation

Chrome Web Store: CSR vs SSR Detector

For Developers: Download chrome-ssr-csr-v3.0.zip below and load unpacked

🙏 Thank You

Thank you to everyone using and providing feedback on this extension! Your input directly shaped these features.

---

Full Changelog: https://github.com/dzienisz/chrome-ssr-csr/blob/main/CHANGELOG.md

Previous Release: v2.3 - Code Refactoring