T.net browserstatistieken 2007 - 2009

Door ACM op zondag 13 december 2009 19:27 - Reacties (20)
Categorie: Browsers, Views: 4.287

Een poosje geleden toonde ik een overzicht van het browsergebruik t/m juni 2009 en beloofde ik dat later nog aan te vulllen. Bij deze :)

De trend van Chrome is doorgezet. Sterker nog, Chrome doet nu meer dan 10% van onze pageviews. Voor de Firefox-fans is er minder goed nieuws, die browser heeft fors ingeleverd om ruimte te maken voor Safari en Chrome. Waar IE nog wat herstel laat zien in de pageviews de afgelopen maanden, is Firefox hard onderuit aan het gaan. Hierbij moet overigens aangetekend worden dat vrije dagen, zoals de feestdagen straks, doorgaans in het nadeel van Internet Explorer uitkomen, dus de december-cijfers zijn nog alles behalve definitief.

Ik heb alle maanden sinds we Google Analytics draaien op een rijtje gezet en in twee plaatjes verzameld. De bezoeken per browser geeft een beeld waarbij Internet Explorer dit jaar definitief onder de 50% is gezakt, maar helaas lijkt de IE6 component te stabiliseren op een bezoekerspercentage iets hoger dan Opera. Zoals gezegd is Firefox onderuit aan het gaan na een hoogtepunt halverwege 2008 en een nieuwe begin 2009. Gezien de introductie van 3.5 na deze laatste piek was, is het maar de vraag of 3.6 hier nog verandering in gaat brengen het komende jaar.

Browser bezoeken per maand

De pageviews geven bij ons altijd net een wat ander beeld dan de bezoeken. De vaste bezoekers gebruiken veel vaker een "alternatieve" browser (zo alternatief zijn ze niet als ze meer dan 10% marktaandeel hebben...). En daar zien we ook weer dat waar eerst Firefox het IE-gebruik terugdrong, nu Chrome - en in mindere mate Safari - het Firefox gebruik terugdringt. In november zien we overigens ineens een herstel van IE, dat zou kunnen komen door de sterke opkomst van Windows 7, waarbij men wellicht wat langer doet over de beslissing om toch weer een andere browser te gebruiken.

Browser pageviews per maand

Als laatste nog de besturingssystemen, geen grafiekje, maar kort even de cijfers: Windows werd in December bij 86,13% van de bezoeken, Machintosh 8,91% en Linux 3,11% gebruikt. Binnen Windows is 7 (28,31%) nu al uitgegroeid tot een hoger marktaandeel dan Vista (23,43%) hoewel XP nog altijd de boventoon voert met 44,29%.

Betere performance voor pChart

Door ACM op dinsdag 20 oktober 2009 19:10 - Reacties (22)
Categorie: Pricewatch, Views: 4.220

Met het Pricewatch 3.0-project hebben we ook nieuwe grafiekjes geintroduceerd. Op onze schaal, zowel kwa data als aantallen grafieken, is de performance van zelfs dat soort details redelijk belangrijk.

Mijn eerste implementatie van een grafiekje met pChart-omgeving bleek 3 seconde nodig te hebben op onze testserver om een csv-bestand van 300 regels (met ieder een label en 3 datapunten) te vertalen naar een grafiekje. Nadere inspectie met xdebug gaf aan dat een groot deel van die tijd zat in de opslag van data in het pData-object.
Deze heeft een vrij inefficiente interne datastructuur, maar heeft ook nog eens exponentiele tijd nodig om datapunten toe te voegen. Effectief werd er voor elk nieuw datapunt (n+1) n maal geteld hoeveel elementen er al in de array zaten. Om 3x 300 datapunten toe te voegen ben je dan dus aardig wat count-operaties verder :X Als ik het goed uitrekenen zit dat op 3* 45150 count-operaties. Domweg het buiten de loop verplaatsen van de count-operatie leverde al een volle seconde tijdswinst op.
Het vervangen van de behoorlijk inefficiente loops door een simpele toevoeging van een array per datarij leverde nog wat winst op.

Verder stikt de code van loze dubbele if's, zoals dit soort dingen:

PHP:
1
2
3
4
5
6
7
8
if ( $DataDescription["Format"]["Y"] == "time" )
         $Value = $this->ToTime($Value);
if ( $DataDescription["Format"]["Y"] == "date" )
         $Value = $this->ToDate($Value);
if ( $DataDescription["Format"]["Y"] == "metric" )
         $Value = $this->ToMetric($Value);
if ( $DataDescription["Format"]["Y"] == "currency" )
         $Value = $this->ToCurrency($Value);


Als je weet dat die waarde "time" heeft, hoef je de andere if's niet meer uit te voeren... In dit geval had de code zelfs nog vervangen kunnen worden door een switch-case structuur, maar ik vond de toevoeging van else's voldoende.

Ook stikte de code van de duplicate floor-calls, waar in deze context een cast naar int sowieso al voldoende was. Voor elke alfatransparante die getekend moest worden, heb ik deze niet zo efficiente constructie vervangen:

PHP:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
$Xi   = floor($X);
     $Yi   = floor($Y);
 
      if ( $Xi == $X && $Yi == $Y)
       {
// ...
       }
      else
       {
       $Alpha1 = (((1 - ($X - floor($X))) * (1 - ($Y - floor($Y))) * 100) / 100) * $Alpha;
        if ( $Alpha1 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi,$Yi,$Alpha1,$R,$G,$B); }
 
       $Alpha2 = ((($X - floor($X)) * (1 - ($Y - floor($Y))) * 100) / 100) * $Alpha;
        if ( $Alpha2 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi+1,$Yi,$Alpha2,$R,$G,$B); }
 
       $Alpha3 = (((1 - ($X - floor($X))) * ($Y - floor($Y)) * 100) / 100) * $Alpha;
        if ( $Alpha3 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi,$Yi+1,$Alpha3,$R,$G,$B); }
 
       $Alpha4 = ((($X - floor($X)) * ($Y - floor($Y)) * 100) / 100) * $Alpha;
        if ( $Alpha4 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi+1,$Yi+1,$Alpha4,$R,$G,$B); }
       }
     }

// Vervangen door:
     $Xi   = (int)$X;
     $Yi   = (int)$Y;
 
      if ( $Xi == $X && $Yi == $Y)
       {
// ..
       }
      else
       {
        $xdiff = ($X - $Xi);
        $ydiff = ($Y - $Yi);
       $Alpha1 = (((1 - $xdiff) * (1 - $ydiff) * 100) / 100) * $Alpha;
        if ( $Alpha1 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi,$Yi,$Alpha1,$R,$G,$B); }
 
       $Alpha2 = (($xdiff * (1 - $ydiff) * 100) / 100) * $Alpha;
        if ( $Alpha2 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi+1,$Yi,$Alpha2,$R,$G,$B); }
 
       $Alpha3 = (((1 - $xdiff) * $ydiff * 100) / 100) * $Alpha;
        if ( $Alpha3 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi,$Yi+1,$Alpha3,$R,$G,$B); }
 
       $Alpha4 = (($xdiff * $ydiff * 100) / 100) * $Alpha;
        if ( $Alpha4 > $this->AntialiasQuality ) { $this->drawAlphaPixel($Xi+1,$Yi+1,$Alpha4,$R,$G,$B); }
       }
     }



Het eindresultaat van de wijzigingen vindt je in deze patch, let er daarbij op dat ik de .class-files hernoemd heb naar .class.php. Verder zou ie op pChart 1.27d moeten werken. Aangezien we .class als extentie al voor java's class files hebben gereserveerd maakte dat het editten van die files in eclipse met pdt zo lastig :)

Het eindresultaat was dat de grafiek op de vrij langzame testserver minder dan een seconde nodig had... Het kan vast nog steeds wel wat efficienter, maar de ergste knelpunten zijn er voor ons nu in ieder geval uit.

T.net browser-statistieken juni 2009

Door ACM op donderdag 2 juli 2009 10:50 - Reacties (29)
Categorie: Browsers, Views: 9.181

De browsermarkt is de afgelopen tijd sterk veranderd. Tweakers.net had altijd al een bovengemiddeld percentage Firefox bezoekers, maar we zien nu ook de posities van Safari en Chrome groter worden. Opera is de afgelopen maanden redelijk constant gebleven.
Ten op zichte van 2 jaar geleden is Internet Explorer sterk gedaald, is Firefox nog wat verder gestegen en hebben Safari en Chrome behoorlijk sterke posities opgebouwd. Waarbij Chrome vooral sterk is onder de vaste bezoekers. Onderstaande cijfers zijn van 22-28 juni in respectievelijk 2007 en 2009.

BezoekenPageviews
Browser2007200920072009
Internet Explorer57,9%43,5%49,3%36,5%
Firefox35,8%39,5%42,6%46,0%
Safari2,3%7,4%2,5%5,7%
Chrome0,0%5,9%0,0%7,1%
Opera3,0%2,6%4,4%3,9%

Op 20 maart kondigde Femme aan dat Tweakers.net de ondersteuning voor Internet Explorer 6 zou staken. In de praktijk heeft dat overigens - voor zover ik weet - nog niet erg veel betekend, behalve dat we nu niet meer de moeite nemen om dingen nog in IE6 te testen.
Maar zelfs in die relatief korte tijd zijn de marktaandelen nog vrij sterk veranderd. Internet Explorer 6 was begin maart nog de derde browser na Firefox 3 en IE7. Maar in de afgelopen drie maanden is het totaalaandeel van Internet Explorer verder gedaald en bovendien is het IE6-deel daarbinnen ook afgenomen. Daardoor zijn nu zowel Safari als Chrome groter dan IE6 en is van de "bekende jongens" alleen Opera nog kleiner. Opera lijkt een zeer trouwe kern van gebruikers te hebben, maar dat betekent tevens dat het aantal gebruikers niet echt veranderd.

Ik heb de browserstatistieken van de weken sinds Femme's aankondiging uit Google Analytics gevist en in twee plaatjes gezet.
Browser visits per week
Browser pageviews per week

Wat je hier ziet is dat Internet Explorer 8 vooral marktaandeel van versie 7 lijkt weg te kapen. Verder zie je dat IE6 langzaamaan verder wegzakt, waarbij de vakantieperiodes duidelijk zichtbaar zijn. Firefox heeft een deel van de opgebouwde winst langzaam weer aan Safari en Chrome afgestaan, vooral de sprong in Safari in de week van 8-14 juni is goed zichtbaar. Dat zal samengehangen hebben met de introductie van Safari 4 op 8 juni.

De introductie van Firefox 3.5 ging gisteren overigens niet ongemerkt voorbij. Op de introductiedag was het aandeel tov alle Firefox-gebruikers al meer dan 30%! Daar deed Internet Explorer 8 meer dan 7 weken om datzelfde te bereiken. Sterker nog, als dit vandaag doorzet, is Firefox 3.5 vandaag of morgen al de grootste browser op Tweakers.net. Ik zal deze grafiekjes over een paar weken nog eens maken.

Snellere Pricewatch-engine: wat resultaten

Door ACM op dinsdag 12 mei 2009 21:28 - Reacties (7)
Categorie: Pricewatch, Views: 4.483

Op vrijdag 20 februari introduceerden we een nieuwe "Pricewatch Engine". Het doel van deze nieuwe engine was om de categoriepagina's in de pricewatch te optimaliseren, zodat de serverside parsetime wat beter werden en het geheel een stuk beter geschikt werd voor toekomstige verdere uitbouw van de mogelijkheden met de specificaties. Een aantal van die uitbreidingen zijn ondertussen geÔmplementeerd en dat bleek inderdaad eenvoudig uit te voeren te zijn, maar daar mag ik uiteraard nu niet verder over uitwijden :P

Ondanks wat kleine bugs bleek de boel goed te werken en dat gaf mij het vertrouwen om direct de dag volgend op de introductie al het aandeel voor de nieuwe engine te verhogen naar 100%. Ik was eerder van plan dat een week lang op te bouwen:
Daarbij sturen we in het begin slechts 10 procent van de categoriepagina's via de nieuwe engine, en als alles goed werkt verhogen we dat stapsgewijs in de loop van volgende week tot 100 procent.
En er zijn uiteraard resultaten, de op een na zwaarste pagina in totale servertijd was het categorieoverzicht van de laptops. Die is na de introductie van de nieuwe engine gezakt naar de 5e plek. Hier een plaatje van de gemiddelde totale servertijd, cputijd, databasetijd en memcachedtijd van een paar dagen voor en een paar dagen na de invoering.

Zoals je ziet is de tijd van ongeveer 0,7 seconde na een kleine gerelateerde optimalisatie al gedaald naar 0,55 seconde om daarna verder door te dalen naar 0,12 seconde. De grootste verschillen die ik heb gezien zaten zelfs in de 85% reductie in servertijd. Uiteraard is met name de factor cputijd ingeruild voor een (kleiner) stukje wachttijd op de Java-engine.
Pricewatch Laptop-categorieen

De impact van de snellere categorieŽn is ook op de algemene cijfers van de pricewatch terug te zien. Een daling van gemiddeld 0,13 naar 0,08 seconde.
Pricewatch totaal

Tweakers.net Pricewatch Accelerator voor IE8

Door ACM op donderdag 23 april 2009 18:28 - Reacties (20)
Categorie: Browsers, Views: 6.412

Na wat copy&pasten van de MS Accelerator-pagina heb ik zojuist een heuse "Accelerator" voor IE8 gemaakt. Het duurde (aanzienlijk) langer om IE8 te downloaden, te installeren en te reboten dan om om die Accelerator in elkaar te klussen. Als je het allemaal veel geavanceerder wil, met previews en dergelijke, dan is het natuurlijk een stuk meer werk.

De Accelerator werkt door een tekst te selecteren, op het accelerator-knopje dat IE8 je dan toont te drukken en dan de "Tweakers.net Pricewatch"-accelerator te kiezen. En dan zoek je in de pricewatch op de geselecteerde tekst. De uiteindelijke xml-file heeft de volgende enorme inhoud gekregen:

XML:
1
2
3
4
5
6
7
8
9
10
11
12
13
<os:openServiceDescription>
  <os:homepageUrl>http://tweakers.net/</os:homepageUrl>
    <os:display>
    <os:name>Tweakers.net Pricewatch</os:name>
    <os:icon>http://tweakimg.net/g/if/icons/tnet.png</os:icon>
    <os:description>Zoek in de Tweakers.net Pricewatch naar producten</os:description>
  </os:display>
  <os:activity category="Search">
    <os:activityAction context="selection">
      <os:execute action="http://tweakers.net/pricewatch/zoeken/?keyword={selection}" method="get"/>
    </os:activityAction>
  </os:activity>
</os:openServiceDescription>



En de boel is triviaal aan IE8 aan te bieden met wat vieze javascript

HTML:
1
<button id="myButton" onclick="window.external.AddService('http://tweakers.net/x/tools/pw-accelerator.xml')">druk hier</button>


De liefhebbers kunnen het met installeren. Met andere browsers levert die vast een javascript-error op ;)

Op- en aanmerkingen hoor ik uiteraard graag.