Auteur: Danny Holstein

Via abacus.ai zijn er nieuwe AI-tools beschikbaar zoals Claude Opus 4.1 en ChatGPT 5. BEE-2B maakt hier dankbaar en handig gebruik van tijdens verschillende werkzaamheden. In dit nieuwe blogbericht worden enkele gebruikerszaken nader besproken.

Een aantal weken geleden is de major-version van Angular naar 20.2 geüpdatet. In een ander technisch blog heb ik gelezen wat de nieuwe features zijn van deze update. Wanneer een Angular applicatie eindelijk live gaat, dan is er experimentele chunk-optimalisatie (wanneer er gebruik gemaakt wordt van lazy loading) in te schakelen. Voor mij was het nieuw om te horen over Rollup en Rolldown, maar daarover ontbrak technische informatie in het blog. Aan Claude Opus 4.1 is gevraagd wat Rollup en Rolldown precies is en wat de verschillen zijn. Het antwoord van deze AI-tool was dat beiden bundlers zijn voor chunk-optimalisatie, waar Rollup is geprogrammeerd met Node.js en JavaScript, daar is Rolldown geprogrammeerd in Rust en dus sneller. In het uitgebreide antwoord stond ook hoe dit is in te schakelen inclusief voorbeelden.

Een andere gebruikerszaak in een Angular applicatie was dat een bepaald component met veel functionaliteit en code toe was aan een refactor. Mijn vraag aan Claude Opus 4.1 was hoe dit het beste aan te pakken is en er nog overige aandachtspunten van belang zijn. In een lang antwoord zaten veel bruikbare tips. Zoals verwacht werd er vermeldt dat het component beter opgesplitst moest worden. Maar ook zaken zoals het toepassen van een DeactivationGuard (zodat een gebruiker een pop-up krijgt te zien wanneer data nog niet is opgeslagen), gebruik maken van de Angular life-cycle-hook-methode: ngOnDestroy, tussen de verschillende stappen meer data opslaan en letten op browser compatibiliteit. Er zijn verschillende voorbeelden gegeven en vooral bij het laatste punt - browser compatibiliteit – werd aanbevolen om in deze gebruikerszaak simpelere Observables te gebruiken in plaats van computedSignals, want de Safari browser kan hier niet heel goed mee overweg.

Voor de rest zijn de AI-tools behulpzaam en bruikbaar bij het oplossen van verschillende problemen. Variërend van problemen met Service workers (zodat een applicatie ook offline blijft werken), de SCSS styles van Angular Material en de Angular Material Datepicker. Een bekende en nog steeds niet opgeloste bug in Angular Material doet zich voor wanneer een Material Table binnen een control-flow (@if) wordt geplaatst. Het probleem hierbij is dat de data van de tabel geladen moet zijn, voordat de paginering en sortering ingesteld wordt dat achteraf gedaan wordt met viewChild. Een van mijn eigen oplossingen was door de tabel in een apart component te plaatsen. Aan een van de AI-tools is om een alternatief gevraagd. Ten eerste werd bevestigd dat dit een bekende bug is en de AI-tool kwam met een elegante oplossing. De CSS propery: display zorgt ervoor dat een element aanwezig is in de DOM maar hoeft niet getoond te worden. Deze oplossing voorkomt een extra component met alleen een tabel, zie de afbeelding hieronder:

Tijdens het ontwikkelen van applicaties kunnen zich allerlei problemen voordoen. De situatie doet zich wel eens voor dat ik niet snel zie waar de oorzaak ligt. Aan de AI-tools vraag ik in zulke gevallen vervolgens om een checklist te genereren met mogelijk oorzaken en eventuele oplossingen. Door middel van een checklist is er punt-voor-punt af te gaan en zijn er zaken uit te sluiten. Praktische voorbeelden hiervan zijn: problemen die zich voordeden wanneer er tussen verschillende Github accounts is geschakeld, wanneer een lokale docker container met database toegang niet meer werkt, problemen met HTTPS en SSL/TLS certificaten en allerlei connectie-problemen met verschillende databases.

In de IT-wereld worden veel en vaak afkortingen gebruikt voor verschillende technische zaken. Wat betreft email-functionaliteiten waren een aantal afkortingen compleet nieuw voor mij. Aan de AI-tools is voorgelegd om meer informatie te geven over deze afkortingen en waar dit eventueel is te veranderen. Drie voorbeelden van afkortingen zijn: DMARC (Domain-based Message Authentication, Reporting & Conformance), DKIM (DomainKeys Identified Mail) en SPF (Sender Policy Framework). Wanneer eenmaal duidelijk is waar afkortingen voor staan, dan is het vinden van oplossingen eveneens iets eenvoudiger. De AI-tools hebben aangegeven hoe deze zaken zich met elkaar verhouden en waar deze zijn aan te passen.

Een andere gebruikerszaak was het converteren van een MSSQL database naar een PostgreSQL database. Hiervoor heeft BEE-2B al een gespecialiseerd programma aangeschaft, namelijk DbConvert dat onder normale omstandigheden veel werk uit handen neemt. Het probleem dat zich voordeed dat was dat de conversie niet foutloos verliep en DbConvert duidelijk errors aangaf. Omdat dit anders een lang proces zou worden van trail-and-error zijn aan de AI-tools de errors voorgelegd en de verschillende opties die DbConvert biedt. Een van de oorzaken waren emojies die zich bevonden in bepaalde kolommen van de databasetabellen in de MSSQL database, maar de PostgreSQL database die accepteerde dit niet. Ten eerste is aan Claude Opus 4.1 gevraagd om hiervoor een effectief cleanup-script te maken, waardoor de emojies werden verwijderd. Hierna bleven er een aantal errors over en is opnieuw aan Claude Opus 4.1 gevraagd welke opties er in DbConvert het beste aangevinkt kunnen worden. De AI-tool kwam met goed advies en de conversie lukte eindelijk zonder errors.

Met de verschillende AI-tools is het eenvoudig om afbeeldingen te genereren en ook op Internet zijn hier verschillende tools voor beschikbaar. Via abacus.ai is het aanpassen van afbeeldingen niet met iedere AI-tool mogelijk, maar wel met: ChatGPT 5, ChatGPT 4.1 en Claude Sonnet 3.7. Via abacus.ai heb ik gebruik gemaakt van ChatGPT 5 om een afbeelding te genereren. Via de chat is er in termen gevraagd om een afbeelding met: ‘exotische vibe, vogels, een fontein en veel groen’. Het resultaat is te zien in de afbeelding hieronder.

Een heel ander en nieuw terrein voor mij was om gebruik te maken van image-to-video. Op abacus.ai zit de knop hiervoor best goed verstopt en er zijn verschillende video-modellen beschikbaar, zoals: Seedance Pro, Kling AI v2.5, Veo 3, Wan 2.5, en anderen. Wat deze video-modellen precies inhielden, heb ik gezien in verschillende YouTube filmpjes, waar de verschillende video-modellen met elkaar worden vergeleken. De verschillende video-modellen hebben nog wel regelmatig glitches. Sinds 2 maanden wordt Seedance Pro niet alleen het meest gebruikt, maar heeft dit ook positieve feedback van de community. Bovenstaande afbeelding heb ik omgezet in een video en in het prompt getypt wat er moest gebeuren (vogels die wegvliegen, de fontein die water spuit en meer animatie). Het genereren van video’s – vooral op maximale kwaliteit en duur – dat is zeer kostbaar wat betreft credits. In een ander blogbericht over AI-tools zal waarschijnlijk dit onderwerp nader worden behandeld. Hieronder staat een video van mijn eerste experimenten en deze video heeft kleine glitches: