02 Dec 2009
Geschreven door: Daniël Schrijver - Oracle in: achtergrondinfo, gratis tools, methoden en technieken, software
Gisteren heeft Google een nieuwe asynchrone tracking code (natuurlijk in bèta) voor Google Analytics aangekondigd. Ik zal proberen uit te leggen waarom dit een interessante ontwikkeling is.
Allereerst een korte uitleg wat er allemaal qua communicatie tussen de browser en het datacenter van de betreffende website plaatsvindt, op het moment dat er een pagina wordt opgevraagd. Ik gebruik hierbij een aantal plaatjes uit de presentatie van Sean Power en Alistair Croll waarover ik al eerder schreef.
Nadat er eerst met elkaar is afgesproken (veilig) met elkaar te praten, vraagt de browser bijvoorbeeld de homepagina op, waarop de server deze verstuurt. Hierbij worden ook alle objecten die op deze pagina worden genoemd, één voor één verstuurd. En zoals het plaatje al aangeeft, kan hierbij een soort file ontstaan. In hun aankondiging vergelijkt Google het met een snelweg: Hoe meer auto’s op dezelfde rijbaan rijden, des te langzamer het verkeer gaat. En file op internet zorgt voor langzamere pagina laadtijden en dat wil je niet.
De Google Analytics tracker code wordt opgevraagd bij Google, net zoals eventuele mashup informatie bij derden wordt opgevraagd.
Het opvragen van de Google tracker vond tot nu toe synchroon (één voor één) plaats met de overige content, waardoor het tonen van de pagina content weleens langer kon duren.
Met deze nieuwe asynchrone tracker van Google Analytics wordt het javascript door een aparte ‘http thread’ afgehandeld, of zoals Google het zelf noemt, het gebruikt een andere rijbaan op de snelweg, waardoor het laden (van de gehele pagina) veel sneller gaat:
“Think of the asynchronous tracking code snippet as a script that uses a “separate lane” to handle part of the processing of your webpage. As the number of cars (or in this case, scripts on your webpage) increases, the asynchronous tracker uses this lane to reduce webpage load time. Websites that use many scripts or rely on rich media content will especially benefit from this new method, but even lightweight sites will see improvements”
Zoals ik al in mijn eerste posting schreef: Conversie optimalisatie begint met performance optimalisatie. Snellere paginas verkopen meer.
Naast dat deze nieuwe tracker dus mee helpt om pagina’s sneller te laten laden, zijn er nog twee zeer interessante ‘bijwerkingen’:
Wie heeft er nu inzicht in de meetfouten van zijn/haar site? En wie zou deze nieuwe bèta tracker code willen testen en met ons de verschillen in metingen willen delen?
* Sneller op de hoogte? Abonneer je gratis op onze RSS feed of ons Twitter kanaal !
19 Reacties
Jeroen van Eck
02|Dec|2009 (13:26) 1Ziet er goed uit! Maar gaat dit veel verschil maken qua laadtijd of is het meer gericht op het verminderen van de meetfouten?
Wat is trouwens het verschil tussen de twee bijwerkingen die je noemt? Komt dit niet op hetzelfde neer?
Reinout Wolfert - SNS Bank
02|Dec|2009 (13:49) 2Goed artikel. Had het nieuws wel voorbij zien komen, maar wist niet direct wat het voordeel was. Nu wel. Over de nieuwe code en het installeren daarvan (mocht je die willen proberen), hier staat een instructie: http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html
Ik zal even kijken of we hem op webanalisten.nl kunnen gaan draaien, ben nl. wel benieuwd naar de bijwerkingen en dan vooral de positieve
Daniël Schrijver - Oracle
02|Dec|2009 (14:05) 3@Jeroen Goede vragen Jeroen. Het verschil qua laadtijd zal wellicht niet zo enorm groot zijn, maar voor een al vanaf 500 milliseconden (0,5 seconden) snellere site zijn er al significante relaties op omzet geconstateerd door o.a. Bing en Google. Ik denk dus dat dat de uiteindelijke insteek van Google is geweest om deze ontwikkeling te maken.
V.w.b. de twee ‘bijwerkingen’ die ik noem, deze komen ook uit de aankondiging van Google zelf. Uit de detail instructies zoals die op de Google Code pagina staan (die Reinout hierboven noemt), haal ik met name het feit dat je de JavaScript nu hoger in je pagina kan opnemen, zonder dat het het laden van de pagina beïnvloedt, en daardoor dus vaker uitgevoerd zal worden. Maar het schijnt ook flexibeler in gebruik te zijn zodat je nauwkeuriger gebruikers activiteiten kunt meten. Hier ben ik verder nog niet ingedoken.
Bart Schouten
02|Dec|2009 (14:38) 4@Daniel: “Het verschil qua laadtijd zal wellicht niet zo enorm groot zijn, maar voor een al vanaf 500 milliseconden (0,5 seconden) snellere site zijn er al significante relaties op omzet geconstateerd door o.a. Bing en Google.” <- Heb je daar een referentie van? Dat is wel erg interessant namelijk
En goed artikel, ik duik direct even in de docs bij Google Code.
Daniël Schrijver - Oracle
02|Dec|2009 (14:44) 5@Bart ik heb hier in mijn eerste post op webanalisten aandacht aan besteed. Kijk hier voor de post en de daarin vernoemde presentaties en onderzoeken
Aaron Peters
02|Dec|2009 (15:09) 6Dit is weer een mooi voorbeeld van front-end code optimalisatie met het doel de laadtijd (en dus user experience) te verbeteren.
Door het ga.js JavaScriptbestand asynchroon te laden vanaf de google-analytics.com server, is er geen risico meer dat je website traag laadt als de google-analytics.com down of traag is. Dat is mijn inziens een groot voordeel.
Als je de tracking code nu hoger in de pagina zet, dan zullen minder metingen verloren gaan. Immers, met de oorspronkelijke tracking code onderaan in de pagina zul je een aantal bezoeken niet hebben gelogd in GA, omdat de bezoeker de pagina verliet voordat de GA code actief werd.
Vincent van Scherpenseel
02|Dec|2009 (15:21) 7Meer informatie over load-time optimization eerder op Webanalisten.nl:
http://www.webanalisten.nl/analyse/loadtime-optimization.html
http://www.webanalisten.nl/analyse/loadtime-optimization-deel-2.html
Mark
02|Dec|2009 (15:27) 8Ik snap het niet zo goed eerlijk gezegd, op dit moment haalt Google de analytics code toch ook al van het google.com domain over een aparte http “verbinding”? Wat is er nu anders dan?
Bjorn van der Neut
02|Dec|2009 (16:50) 9Ik vraag mij af of dit ook helpt als je geen tracking doet van click events/winkel wagentje etc. Maar gewoon de normale meting die google doet. Weet iemand dit?
Of is de naam “asynchrone tracking code” een beetje misleidend? En gaat het gewoon over de “normale” data die google verzamelt?
Bart Schouten
02|Dec|2009 (17:13) 10@Mark Heb inmiddels Google code een beetje doorgekeken en je moet het zien als een AJAX call (ook asynchroon). Op de oude wijze de JS geheel ingeladen wordt en het verwerken/laden van de pagina daar dus op moet wachten. Op de nieuwe wijze wordt de aanvraag voor het meetscript wel gedaan maar wordt die asynchroon, dus net als met AJAX, ingeladen. De pagina hoeft er dus niet op te wachten. Omdat dit natuurlijk nogal anders werkt, moet je ook alle overige calls (tracking voor pageview, events, etc.) aanpassen aan de nieuwe manier van werken. De oude manier gaat er namelijk vanuit dat het script al ingeladen is (en dus geen controle op aanwezigheid behalve een try/catch blok), maar met de asynchrone wijze is het belangrijk dat elke tracking ‘call’ controleert of het meetscript al ingeladen is.
@Bjorn De nieuwe wijze van inladen heeft als gevolg dat alle tracking op een andere manier moet (_gaq.push([’_trackPageview’]);). De tracking blijft gewoon gelijk aan de huidige situatie, het inladen van het meetscript en het aanroepen van de calls is dus anders.
Daniël Schrijver - Oracle
02|Dec|2009 (17:17) 11@Bjon Het zou ook voor de normale metingen die google doet moeten gelden. Asynchroon is meer een beschrijving hoe de browser de code op een andere manier behandelt/uitvoert
@Mark De huidige manier waarop de code wordt opgehaald/praat met Google is synchroon met de overige objecten op de pagina. Dus de browser wacht (snurken in het plaatje) tot hij van elk verzoek dat hij gedaan heeft antwoord heeft gehad om een volgende verzoek te doen. Als hij dus lang op Google moet wachten, duurt het dus ook langer tot de pagina geladen is. Met de vernieuwde asynchrone manier wordt dit mogelijke probleem voorkomen.
Frans van Dolderen
02|Dec|2009 (17:36) 12Wellicht zal de bounce rate iets gaan stijgen als je overgaat naar de nieuwe trackings code.
Alle bezoekers die nu op je website landen maar vertrekken voordat de GA trackings code is geladen worden momenteel niet geteld. Als de nieuwe code sneller laadt zullen deze bezoekers wel geteld worden.
Deze theorie volgend zou ook het aantal pages per visit iets kunnen stijgen.
Het is wellicht een nuance verschil maar ben benieuwd of we dit terug gaan zien in de stats.
Bart Schouten
02|Dec|2009 (23:31) 13Ik ben toch nog iets dieper in gegaan op de werking van de nieuwe methode van laden. In de blog van Google van gisteren (http://googlecode.blogspot.com/2009/12/google-analytics-launches-asynchronous.html) wordt e.e.a. duidelijk uitgelegd.
1) Eerst maak je een nieuwe array : var _gaq = _gaq || []; Die array stop je vervolgens vol met opdrachten. Dat kun je in 1x doen door _gaq.push() met komma gescheiden opdrachten aan te roepen. Of 1 opdracht per keer. De opdrachten zijn het instellen van de tracker (analytics code) of een pageview of een andere geldige opdracht (zoals we al kennen).
2) Pas onderop vlak voor de /body (dan heb je ‘t meeste voordeel van het vooraf instellen van de array) ga je de code inladen. Doordat het laden van de code aan een javascript function wordt gekoppeld kan deze asynchroon lopen, daar zit ‘m de truuk. Als het meetscript helemaal is ingeladen gaat deze opzoek naar de global variabele _gaq en leest alle opdrachten die je ingesteld had uit. Vervolgens voert de code die opdrachten uit.
Je kunt dus analytics van alles laten tracken, zonder dat de code is geladen. Pas als die asynchroon is geladen en klaar is, maakt deze zelf een instantie van de tracker en voert daarmee alle opdracht uit.
Daniël Schrijver - Oracle
03|Dec|2009 (9:19) 14@Bart Bedankt dat je dit met ons wilde delen. Naast de performance voordelen, mogelijk iets hogere pages per visit en mogelijk iets hogere bounce rate brengt de nieuwe tracker ook (eenmalige implementatie) werkzaamheden met zich mee. Wegen deze werkzaamheden op tegen de voordelen? Ik ben benieuwd wanneer we de eerste resultaten zien verschijnen met de verschillen tussen de trackers. Als deze inderdaad positief uitvallen, denk ik pas dat de meerderheid zal gaan overstappen op deze nieuwe tracker.
Sander Lems
03|Dec|2009 (10:39) 15Wat is mij afvraag is of ‘oudere’ webbrowsers zoals IE6 correct met de techniek die de tracker gebruikt kunnen omgaan. Dus is de nieuwe tracker straks na het BETA stadium effectief in te zetten of zal dit nog even duren?
Mark
03|Dec|2009 (10:57) 16@bart: dank je is nu helder!
@sander: de “truuk” werkt alleen voor browsers die HTML5 support hebben (FF 3.6), maar het blijft wel werken voor oudere browsers (zonder het voordeel van async)
Daniël Schrijver - Oracle
06|Dec|2009 (20:31) 17Volgens Steve Souders, een guru op het gebied van Fast Websites, schat in deze uitgebreide post dat deze nieuwe tracker, weleens een 200ms snellere laadtijd van de pagina tot gevolg zou kunnen hebben, evenals 10% meer data. Ik ben erg benieuwd wie er deze verbeteringen kan bewijzen/ontkrachten.
André Scholten - Traffic4u
07|Dec|2009 (15:36) 18Ik moet eerlijk zeggen dat ik het een beetje een “kijk ons eens technisch zijn” bericht van Google vind. Het attribuut async wordt pas ondersteund in HTML 5 wat praktisch niemand gebruikt. Verder is de try-catch constructie vervangen met een iets nettere oplossing die direct na het laden van de ga.js zijn ding doet. Je kunt daarbij ook al metingen in een wachtrij zetten.
Wel handig, maar dat is het dan ook wel voor nu.
Bart Schouten
07|Dec|2009 (21:48) 19@Andre: in de verandering die jij ‘iets nettere oplossing’ noemt zit ‘m nou net de crux. Overigens denk ik dat je de async tracking in combinatie met Google Closure (http://code.google.com/closure/compiler/), Google Page Speed en de Site Performance toevoeging aan Google Webmaster Tools moet zien als geheel aan website performance optimalisatie tools en hulpmiddelen. Er zal ongetwijfeld ook nog wel meer uit diezelfde koker komen in de toekomst.
Laat een reactie achter