Cambios implementados: 1. Lazy loading de imágenes: - catalog.js: loading="lazy" decoding="async" en part cards y detail panel - inventory.js: lazy loading en imagen de detalle de item 2. Minificación de assets: - scripts/minify-assets.sh: minifica JS (terser) y CSS para POS y Dashboard - 25 archivos .min.js + 5 .min.css generados en pos/static/ - 14 archivos .min.js + 8 .min.css generados en dashboard/ 3. Nginx auto-serve minified: - try_files $1.min.js antes de servir .js original - try_files $1.min.css antes de servir .css original - Transparente para los templates HTML (cero cambios en HTML) 4. Cache warming script: - scripts/warm_vehicle_cache.py: pobla Redis con vehicle info por batches - Mitiga DISTINCT ON + 4 JOINs sobre 2B filas - Corre en background, procesa ~1.5M parts Tests: 73/73 pasando
Vehicle Database Dashboard
A web-based dashboard for searching and filtering vehicle data from your database.
Features
- Filter vehicles by brand, model, year, and engine
- Responsive web interface with Bootstrap
- Real-time filtering and search
- Detailed vehicle information display
- Modern UI with cards and badges
Prerequisites
- Python 3.x
- Flask (installed via
sudo apt-get install python3-flask) - SQLite database with vehicle data (created in the vehicle_database directory)
Setup
- Make sure you have the vehicle database created in the
../vehicle_database/vehicle_database.dbpath - Install Flask:
sudo apt-get install python3-flask - Run the dashboard server:
python3 server.py
Usage
-
Start the server:
cd dashboard python3 server.py -
Open your web browser and navigate to
http://localhost:5000 -
Use the filters on the left panel to search for vehicles:
- Select a brand from the dropdown
- Select a model (based on the selected brand)
- Select a year
- Select an engine type
- Click "Search Vehicles" to apply filters
-
The results will appear in the right panel with detailed information
API Endpoints
The dashboard uses the following API endpoints:
GET /api/brands- Get all vehicle brandsGET /api/models?brand=[brand]- Get models for a specific brandGET /api/years- Get all yearsGET /api/engines- Get all enginesGET /api/vehicles?[filters]- Search vehicles with optional filters
File Structure
dashboard/
├── index.html # Main dashboard page
├── dashboard.js # Frontend JavaScript
├── server.py # Flask backend
├── requirements.txt # Python dependencies
├── start_dashboard.sh # Startup script
└── README.md # This file
Customization
You can customize the dashboard by:
- Modifying the CSS styles in index.html
- Adding more filters in the JavaScript
- Changing the layout in index.html
- Adding more vehicle details in the display
Troubleshooting
- If the server won't start, make sure the vehicle database exists
- If filters don't populate, check that the database has data
- If the page doesn't load, verify that Flask is installed correctly