0.2.3 • Published 1 month ago
@stacksleuth/browser-extension v0.2.3
@stacksleuth/browser-extension
StackSleuth Browser Extension
🚀 What is StackSleuth Browser Extension?
Comprehensive browser extension for real-time performance monitoring - DevTools integration, content script injection, tab performance tracking, and interactive performance visualization.
✨ Key Features
- 🔧 DevTools Integration: Enhanced browser developer tools
- 📱 Content Script Injection: Automatic webpage monitoring
- 📊 Tab Performance Tracking: Per-tab performance analysis
- 🎨 Interactive Visualization: Real-time performance charts
- ⚡ Live Monitoring: Instant performance feedback
- 🔍 Performance Inspector: Detailed performance breakdowns
- 📈 Historical Data: Performance trend analysis
- 🎯 Custom Alerts: Performance threshold notifications
📦 Installation
npm install @stacksleuth/browser-extension
yarn add @stacksleuth/browser-extension
pnpm add @stacksleuth/browser-extension
🏁 Quick Start
// manifest.json
{
"manifest_version": 3,
"name": "StackSleuth Performance Monitor",
"version": "1.0.0",
"permissions": ["activeTab", "storage", "webRequest"],
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["stacksleuth-content.js"]
}],
"devtools_page": "devtools.html"
}
// background.js
import { BrowserExtension } from '@stacksleuth/browser-extension';
const extension = new BrowserExtension({
enabled: true,
enableDevTools: true,
trackingDomains: ['*']
});
extension.initialize();
// content-script.js
import { BrowserExtension } from '@stacksleuth/browser-extension';
// Automatically monitor page performance
const extension = new BrowserExtension();
extension.collectPageMetrics();
📚 Resources
🤝 Contributing
We welcome contributions! Please see our Contributing Guide for details.
📄 License
MIT License - see the LICENSE file for details.
Website • Documentation • NPM Registry • GitHub
Made with ⚡ by StackSleuth