Add comprehensive database setup and user management system

- Implement PostgreSQL database schema with users and bookmarks tables - Add database connection pooling with retry logic and error handling - Create migration system with automatic schema initialization - Add database CLI tools for management (init, status, validate, etc.) - Include comprehensive error handling and diagnostics - Add development seed data and testing utilities - Implement health monitoring and connection pool statistics - Create detailed documentation and troubleshooting guide Database features: - Users table with authentication fields and email verification - Bookmarks table with user association and metadata - Proper indexes for performance optimization - Automatic timestamp triggers - Transaction support with rollback handling - Connection pooling (20 max connections, 30s idle timeout) - Graceful shutdown handling CLI commands available: - npm run db:init - Initialize database - npm run db:status - Check database status - npm run db:validate - Validate schema - npm run db:test - Run database tests - npm run db:diagnostics - Full diagnostics
2025-07-19 23:21:50 +02:00
commit 0abee5b794
66 changed files with 45023 additions and 0 deletions
--- a/tests/test_performance_optimizations.html
+++ b/tests/test_performance_optimizations.html
@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Performance Test - Bookmark Manager</title>
+    <style>
+        body { font-family: Arial, sans-serif; padding: 20px; }
+        .test-result { margin: 10px 0; padding: 10px; border-radius: 4px; }
+        .pass { background-color: #d4edda; color: #155724; }
+        .fail { background-color: #f8d7da; color: #721c24; }
+        .info { background-color: #d1ecf1; color: #0c5460; }
+    </style>
+</head>
+<body>
+    <h1>Bookmark Manager Performance Test</h1>
+    <div id="test-results"></div>
+
+    <script>
+        // Test performance optimizations
+        function runPerformanceTests() {
+            const results = document.getElementById('test-results');
+            
+            // Test 1: Check if debounced search is implemented
+            const scriptContent = fetch('script.js')
+                .then(response => response.text())
+                .then(content => {
+                    const tests = [
+                        {
+                            name: 'Debounced Search (300ms delay)',
+                            test: content.includes('debouncedSearch') && content.includes('searchTimeout') && content.includes('300'),
+                            description: 'Reduces excessive filtering during search input'
+                        },
+                        {
+                            name: 'Virtual Scrolling/Pagination',
+                            test: content.includes('virtualScrollThreshold') && content.includes('renderLargeCollection'),
+                            description: 'Handles large bookmark collections efficiently'
+                        },
+                        {
+                            name: 'DOM Optimization',
+                            test: content.includes('DocumentFragment') && content.includes('requestAnimationFrame'),
+                            description: 'Minimizes reflows during rendering'
+                        },
+                        {
+                            name: 'Loading States',
+                            test: content.includes('showLoadingState') && content.includes('isLoading'),
+                            description: 'Shows progress for time-consuming operations'
+                        },
+                        {
+                            name: 'Batch Rendering',
+                            test: content.includes('renderFoldersInBatches') && content.includes('batchSize'),
+                            description: 'Renders folders in batches to prevent UI blocking'
+                        }
+                    ];
+
+                    tests.forEach(test => {
+                        const div = document.createElement('div');
+                        div.className = `test-result ${test.test ? 'pass' : 'fail'}`;
+                        div.innerHTML = `
+                            <strong>${test.test ? '✅' : '❌'} ${test.name}</strong><br>
+                            <small>${test.description}</small>
+                        `;
+                        results.appendChild(div);
+                    });
+
+                    // Add configuration info
+                    const configDiv = document.createElement('div');
+                    configDiv.className = 'test-result info';
+                    configDiv.innerHTML = `
+                        <strong>📊 Performance Configuration</strong><br>
+                        <small>
+                            • Virtual scroll threshold: 100 bookmarks<br>
+                            • Items per page: 50 bookmarks<br>
+                            • Search debounce delay: 300ms<br>
+                            • Batch rendering: 5 folders at a time
+                        </small>
+                    `;
+                    results.appendChild(configDiv);
+                })
+                .catch(error => {
+                    const div = document.createElement('div');
+                    div.className = 'test-result fail';
+                    div.innerHTML = `<strong>❌ Error loading script.js</strong><br><small>${error.message}</small>`;
+                    results.appendChild(div);
+                });
+        }
+
+        // Run tests when page loads
+        document.addEventListener('DOMContentLoaded', runPerformanceTests);
+    </script>
+</body>
+</html>