6.8 KiB

Raw Blame History

Analyseer een website op prestaties

Overzicht van de opdracht

Prestaties analyseren is een essentiële vaardigheid voor moderne webontwikkelaars. In deze opdracht voer je een uitgebreide prestatie-audit uit van een echte website, waarbij je zowel browsergebaseerde tools als externe diensten gebruikt om knelpunten te identificeren en optimalisatiestrategieën voor te stellen.

Je taak is om een gedetailleerd prestatierapport te leveren dat jouw begrip van webprestatieprincipes aantoont en jouw vermogen om professionele analysetools effectief te gebruiken.

Instructies voor de opdracht

Kies een website voor analyse - selecteer een van de volgende opties:

Een populaire website die je vaak gebruikt (nieuwssite, sociale media, e-commerce)
Een open-source projectwebsite (GitHub-pagina's, documentatiesites)
Een website van een lokaal bedrijf of portfolio
Je eigen project of eerder coursework

Voer een analyse met meerdere tools uit met ten minste drie verschillende benaderingen:

Browser DevTools - Gebruik de Chrome/Edge Performance-tab voor gedetailleerde profilering
Online audittools - Probeer Lighthouse, GTmetrix of WebPageTest
Netwerkanalyse - Onderzoek resource-lading, bestandsgroottes en aanvraagpatronen

Documenteer je bevindingen in een uitgebreid rapport dat het volgende bevat:

Analyse van prestatietrends

Laadtijdmetingen vanuit meerdere tools en perspectieven
Core Web Vitals scores (LCP, FID, CLS) en hun implicaties
Resourceverdeling die laat zien welke middelen het meest bijdragen aan de laadtijd
Netwerk waterval analyse om blokkerende middelen te identificeren

Probleemidentificatie

Specifieke prestatieknelpunten met ondersteunende gegevens
Oorzaakanalyse die uitlegt waarom elk probleem optreedt
Gebruikersimpactbeoordeling die beschrijft hoe problemen echte gebruikers beïnvloeden
Prioriteitsrangschikking van problemen op basis van ernst en moeilijkheidsgraad van oplossen

Optimalisatie-aanbevelingen

Specifieke, uitvoerbare verbeteringen met verwachte impact
Implementatiestrategieën voor elke aanbevolen wijziging
Moderne best practices die kunnen worden toegepast (lazy loading, compressie, etc.)
Tools en technieken voor voortdurende prestatiemonitoring

Onderzoeksvereisten

Vertrouw niet alleen op browsertools - breid je analyse uit met:

Externe auditdiensten:

Google Lighthouse - Uitgebreide audits
GTmetrix - Inzichten in prestaties en optimalisatie
WebPageTest - Testen onder realistische omstandigheden
Pingdom - Wereldwijde prestatiemonitoring

Gespecialiseerde analysetools:

Bundle Analyzer - Analyse van de grootte van JavaScript-bundels
Image optimization tools - Mogelijkheden voor optimalisatie van middelen
Security headers analysis - Impact van beveiligingsprestaties

Formaat van de resultaten

Maak een professioneel rapport (2-3 pagina's) dat het volgende bevat:

Samenvatting - Overzicht van belangrijkste bevindingen en aanbevelingen
Methodologie - Gebruikte tools en testaanpak
Huidige prestatiebeoordeling - Basisstatistieken en metingen
Geïdentificeerde problemen - Gedetailleerde probleemanalyse met ondersteunende gegevens
Aanbevelingen - Geprioriteerde verbeterstrategieën
Implementatieplan - Stapsgewijze optimalisatieplanning

Voeg visueel bewijs toe:

Screenshots van prestatietools en statistieken
Grafieken of diagrammen die prestatiedata tonen
Voor/na vergelijkingen waar mogelijk
Netwerk waterval diagrammen en resourceverdelingen

Beoordelingscriteria

Criteria	Uitmuntend (90-100%)	Voldoende (70-89%)	Verbetering nodig (50-69%)
Diepte van analyse	Uitgebreide analyse met 4+ tools, gedetailleerde statistieken, oorzaakanalyse en gebruikersimpactbeoordeling	Goede analyse met 3 tools, duidelijke statistieken en basisprobleemidentificatie	Basisanalyse met 2 tools, beperkte diepgang en minimale probleemidentificatie
Diversiteit van tools	Gebruik van browsertools + 3+ externe diensten met vergelijkende analyse en inzichten van elk	Gebruik van browsertools + 2 externe diensten met enige vergelijkende analyse	Gebruik van browsertools + 1 externe dienst met beperkte vergelijking
Probleemidentificatie	Identificeert 5+ specifieke prestatieproblemen met gedetailleerde oorzaakanalyse en gekwantificeerde impact	Identificeert 3-4 prestatieproblemen met goede analyse en enige impactmeting	Identificeert 1-2 prestatieproblemen met basisanalyse
Aanbevelingen	Biedt specifieke, uitvoerbare aanbevelingen met implementatiedetails, verwachte impact en moderne best practices	Biedt goede aanbevelingen met enige implementatierichtlijnen en verwachte resultaten	Biedt basisaanbevelingen met beperkte implementatiedetails
Professionele presentatie	Goed georganiseerd rapport met duidelijke structuur, visueel bewijs, samenvatting en professionele opmaak	Goede organisatie met enig visueel bewijs en duidelijke structuur	Basisorganisatie met minimaal visueel bewijs

Leerdoelen

Door deze opdracht te voltooien, toon je aan dat je in staat bent om:

Professionele prestatietools en methodologieën toe te passen
Prestatieknelpunten te identificeren met data-gedreven analyse
De relatie tussen codekwaliteit en gebruikerservaring te analyseren
Specifieke, uitvoerbare optimalisatiestrategieën aan te bevelen
Technische bevindingen professioneel te communiceren

Deze opdracht versterkt de prestatieconcepten die in de les zijn geleerd en bouwt praktische vaardigheden op die je gedurende je carrière als webontwikkelaar zult gebruiken.

Disclaimer:
Dit document is vertaald met behulp van de AI-vertalingsservice Co-op Translator. Hoewel we streven naar nauwkeurigheid, dient u zich ervan bewust te zijn dat geautomatiseerde vertalingen fouten of onnauwkeurigheden kunnen bevatten. Het originele document in de oorspronkelijke taal moet worden beschouwd als de gezaghebbende bron. Voor kritieke informatie wordt professionele menselijke vertaling aanbevolen. Wij zijn niet aansprakelijk voor eventuele misverstanden of verkeerde interpretaties die voortvloeien uit het gebruik van deze vertaling.

6.8 KiB Raw Blame History