Onlangs mocht ik aan de website CloudTools uitleggen hoe ik online diensten en tools in de praktijk gebruik. Een verhaal over onder andere Remember the Milk, Toggl en Evernote, maar ook over de inzet van Yammer in een intranet bij één van onze klanten.

Het artikel is hier te lezen.

CloudTools is het platform voor online software en SaaS. Hier lees je reviews, tips en nieuws over cloud computing. Een erg goede resource op dit gebied!

Ontwikkelaars die ontwikkelen binnen Smartsite iXperion hebben de mogelijkheid gebruik te maken van de Smartsite TestSuite. Deze windows applicatie maakt het mogelijk de site waaraan ontwikkeld wordt lokaal te draaien, en biedt een groot aantal functionaliteiten die het leven van een Smartsite ontwikkelaar vereenvoudigen. De TestSuite gebruikt in de applicatie een browsercontrol om de ontwikkelde op een lokale webserver zaken te bekijken.

Soms wil je op low-level niveau kijken wat het http verkeer is tussen browser en webserver, en DE tool om dit te doen is Fiddler. Deze tool fungeert als proxy tussen de browser en webserver, en maakt het verkeer inzichtelijk. 

Echter is er één probleem: de TestSuite is een .NET applicatie, en .NET omzeilt altijd de proxy wanneer localhost wordt gebruikt. En de server die de TestSuite start draait op localhost.

Een veel aangedragen oplossing voor dit probleem is het aanroepen van de website op http://127.0.0.1.:<poortnummer> (let op de extra punt na 1). De TestSuite server accepteert dit echter niet.

Gelukkig is er een andere oplossing. Binnen Fiddler is het mogelijk om rules aan te maken in de vorm van een .js bestand. Dit bestand is te vinden in Fiddler onder het menuitem "Rules -> Customize rules". In deze file is onder andere de function OnBeforeRequest(oSession: Session) te vinden, waarin code staat die bij elk request die voorbij Fiddler komt wordt uitgevoerd.

Als binnen de OnBeforeRequest de volgende code wordt toegevoegd, is de site binnen de TestSuite ook op http://EmptySix te bereiken:

if (oSession.HostnameIs("EMPTYSIX")) { oSession.host = "localhost:7812"; }

Fiddler vertaalt de host EMPTYSIX in localhost:7812, welk geaccepteerd wordt door de TestSuite webserver. Voor de (TestSuite) webbrowser lijkt het echter een externe host, en wordt de call dus over de proxy gestuurd.

Toegankelijk bouwen hoeft niet altijd lastig te zijn; gewoon wat goede vuistregels in de gaten houden. De volgende presentatie is gemaakt voor een interne Yahoo! conferentie voor webdevelopers, en somt nog even een aantal veelgemaakte fouten op.

(Via het Yahoo Accessibility Blog)

Momenteel zijn we bij Communited bezig met een nieuwe versie van onze KenTIC afspraakonline module. Door middel van deze module is het mogelijk om bezoekers van een website afspraken te laten maken, en direct in te schieten in een klantvolgsysteem .

Eén van de zaken die in deze nieuwe versie wordt opgepakt is het webrichtlijnen-proof krijgen van de oplossing. Hierbij worden in de basis afspraakmogelijkheden getoond als select-lists, en wordt door middel van een jquery javascript hiervan een mooi ogende kalender gegenereerd waarin de afspraken worden weergegeven. Op deze manier kunnen ook bezoekers zonder javascriptmogelijkheden een afspraak maken, en hebben bezoekers met javascript een meer intuitieve interface om dat te doen.

Bij de bouw van het script liepen we echter tegen performanceissues aan; zeker in IE7 wat het script nogal traag.

Door middel van Firebug ben ik op zoek gegaan naar de oorzaak. Firebug heeft een aantal mogelijkheden om performance te loggen, waarbij ik dankbaar gebruik heb gemaakt van de console.profile() mogelijkheid. Hierbij heb ik wel eerst even de niet-minified versie van jquery gebruikt, anders zijn de resultaten niet te analyseren.

Het bleek dat de performance vooral zat in de jquery.append() methode. Deze werd in het script veelvuldig gebruikt vanwege; voor elke 5 minuten in de kalender die getoond wordt wordt een div gemaakt, die met .append() werd toegevoegd aan de DOM.

In deze blogpost staat inderdaad beschreven dat .append() inderdaad, wanneer verkeerd gebruikt, een aardige performance-slurper kan zijn. Ik heb dan ook een groot deel van de .append() aanroepen vervangen door simpele string-concatinations, en op die manier het gebruik van .append() zoveel mogelijk beperkt. En wat blijkt: 800 ms van de script execution verdwenen!