Performance & Accessibility
Demo fitur performance dan accessibility yang telah diimplementasikan di ferzui.
Lazy Loading
Komponen dan gambar dimuat secara lazy untuk performa yang lebih baik.
Lazy Loading Images
Lazy Loading Components
Keyboard Navigation
Navigasi keyboard yang lengkap untuk aksesibilitas.
Keyboard Shortcuts
- Tab - Navigasi ke elemen berikutnya
- Shift + Tab - Navigasi ke elemen sebelumnya
- Escape - Tutup modal/dropdown
- Enter - Aktifkan button
- Space - Toggle checkbox
- Arrow Keys - Navigasi menu
Focus Management
Gunakan Tab untuk navigasi antar elemen
Screen Reader Support
Dukungan lengkap untuk screen reader dengan ARIA attributes.
ARIA Enhanced Components
Card dengan ARIA
Konten card ini memiliki proper ARIA attributes untuk screen reader.
High Contrast Mode
Mode kontras tinggi untuk pengguna dengan gangguan penglihatan.
High Contrast Toggle
Card Example
Card ini akan berubah tampilan di high contrast mode.
Reduced Motion
Dukungan untuk pengguna yang prefer reduced motion.
Motion Preferences
Animasi akan dikurangi jika user mengatur prefers-reduced-motion: reduce
Focus Indicators
Indikator fokus yang jelas untuk navigasi keyboard.
Skip Links
Skip links untuk navigasi cepat ke konten utama.
Skip Navigation
Tekan Tab untuk melihat skip link di bagian atas halaman.
Skip link memungkinkan pengguna keyboard untuk melompat langsung ke konten utama.
Performance Metrics
Metrik performa untuk monitoring.
Performance Monitoring
~45KB
Bundle Size (gzipped)
~120ms
Load Time
95+
Lighthouse Score