futtta vist nu ook in het engels

big babelfishGe hebt het misschien al gezien (behalve de feedreader-crowd dan, maar die lezen het nu dus); ik heb een link toegevoegd om deze pagina’s op eenvoudig muisklik-verzoek automatisch in het Engels te laten vertalen. Akkoord, die vertalingen geven meestal maar een vage -en niet zelden humoristische- benadering van de originele tekst, maar die paar internationale bezoekers op zoek naar een poging tot howto’s kunnen er hun voordeel maar bij doen, niet?
Aangezien Altavista Babelfish (Ave Digital) de moeder van alle online vertalingstools is en omdat Google Translate voorlopig niet in de buurt komt qua aangeboden talenparen, gebruiken we de Vis voor onze verovering van de wereld.
Hoe van deze wordpress.com-blog naadloos naar Babelfish switchen? Wel, normalerwijze zou een klein stukje javascript kunnen volstaan, iets als het volgende bijvoorbeeld:

vertaal me

Maar op wordpress.com kunt ge zelf geen javascript invoeren (wat niet slecht is, voor ge het weet zit uw favoriete blogplatform met cross-site-scripting issues), dus dan moet een mens zijn plan trekken met gewone html.
De uiteindelijke oplossing is bijzonder eenvoudig: de translate-link gaat naar een php-scriptje op mijn linux-serverke. Dat script pikt de referer uit de $_server variabele, test of die in de lijst met toegestane domeinen zit (*) en doet, als dat domein snor zit, een redirect naar Babelfish waar de vertaalvisjes onmiddelijk aan het werk gaan. Met dank aan Systran, het Franse bedrijf dat instaat voor de eigenlijk vertaalsoftware, overigens.
(*) Ik heb vooralsnog geen ambitie om vertalings-gateway worden voor Jan, Pier en Pol. Pas op, als die jongens ergens een php-scriptje kwijt kunnen, wil ik hun dat wel bezorgen. En als ze het echt heel vriendelijk vragen (ik drink graag Trappistenbier, Chimay Triple valt tegenwoordig heel goed in de smaak), zou ik hen zelfs kunnen toevoegen aan dat lijstje toegestane domeinen.

Onclick event handler in A HREF’s?

De collega’s van marketing willen bij sommige URL’s onclick event handlers laten toevoegen die elke klik loggen bij een web analytics aanbieder. De Onclick-javascript functie haalt wat gegevens op en voegt die toe aan een request voor een -onzichtbare- image.
Mijn eerste gedacht; niet doen, de onclick wordt eerst uitgevoerd en als de request voor die image te lang duurt (op basis van onze ervaring gingen we uit van ongeveer 0,6 seconden) moet de gebruiker ook extra lang wachten op de pagina die hij/zij opvroeg (want eerst onclick en dan pas request voor de feitelijke pagina in de href). Ik leek hier ook bevestiging voor te vinden op quirksmode dus niet doen?
Dit weekend begon ik me echter af te vragen of dit wel kon kloppen; alle wordpress-blogs bijvoorbeeld, houden klikgedrag op ongeveer die manier (wel niet de traditionele onclick, maar met echte events) bij. En die web analytics aanbieder, zouden die zoiets in productie zetten als dat een probleem zou zijn? Een testje dan maar, met volgende code:






gogoogle

Ik ga dan in de logs van florentsmet.be (site van mijn vrouwken over haar overleden grootvader die kunstschilder was) kijken en zie dat die image in FF perfect geladen wordt als die timeout op een laag cijfer staat (onder de 190 milliseconden) en nooit als die boven die 195 ms. In MSIE lijkt 215 zo een beetje het punt tot waar dat werkt.
Is dat nu een race-condition? En hangt die dan af met welke browser je werkt? Heeft iemand hier ervaring mee, of een paar goeie links waarin dit beschreven wordt? En vooral, op basis van deze tests zou ik besluiten dat die onclick-logging van geklikte links geen probleem is. Iedereen akkoord daarmee dan?

Integratie van externe content of applicaties

Hoe integreer je externe content (of applicaties) het beste? Ik ga hier de komende tijd even induiken met wat eenvoudige demo’s en lijstjes met pro’s en con’s, maar ik zie alvast volgende mogelijkheden:

  1. server-side binnenhalen en alles in 1 html-pagina naar de browser duwen
  2. in een popup steken
  3. in een iframe zetten
  4. in een div en die vullen met behulp van een stukje ajax

De keuze voor een bepaalde oplossing hangt ongetwijfeld af van een aantal factoren:

  • is de externe content statisch of dynamisch
  • wordt die externe content snel of traag ‘opgediend’
  • is de content echt extern (i.e. van een ander domein) of gaat het over een ‘lokale’ applicatie die los van de rest van de content staat
  • wat is de impact op usability
  • wat is de impact op “searchability”

Soit, veel vragen maar nog geen mooie antwoorden (wel vage ideeën en enkele vooroordelen). Iedereen die hier een mening over heeft of links naar goeie info kent: schieten in de comments graag (staan sinds kort open voor iedereen). Ik ben er U -zoals steeds- eeuwig dankbaar voor en in ruil mogen jullie dan binnenkort een samenvatting van mijn bevindingen verwachten 🙂

Levend vanop Webtech2007

Zit vandaag op Webtech 2007, een congres dat door cms-channel.be wordt georganiseerd. Heb er al een paar presentaties opzitten en terwijl Philip Achten de toehoorders de BIAC-case door de strot duwt, even de highlights tot nu toe opsommen:
Luc Van de Velde Director Developer & Platform group Microsoft Belgium had het over “Merging design and development in a 2.0 world”. Slotsom: MS biedt framework om aan alle behoeften te voldoen. Interessantste vond ik eigenlijk MS Silverlight, vroeger WPF/E, een browser-plugin (voor Windows en Mac, MSIE, Firefox, Opera, Safari, …) en vooral flash-killer. Maar daar kon/ wilde de man nog niet veel over vertellen, volgende week was het een grote conferentie daarover in Las Vegas.
Volgende spreker was Edwin Mol, freelance webdeveloper, zijn firma heet Siteware. Hij had het over de keuze van een framework en focuste daarbij op open source oplossingen. Naast Ruby on Rails had hij het vooral over een paar Java-frameworks, waaronder Google Web Toolkit, OpenLazlo, Wicket en Rife. Hij was vooral enthousiast over Rife, nadien nog even met hem gebabbeld en dat is een open source project van een Vlaming (moet nog opzoeken wie). Rife is stateless en component-oriented (in tegenstelling tot struts dat dan response/request-based is). Door middel van metadata die je aan je classes toevoegt, kun je -als ik het goed begrepen heb, ge kent mij- database-schema genereren en ook client-side validatie automatisch uit laten voeren door het framework. Veel meer info over Rife features staat hier. Wicket zou ook interessant zijn, is een open source framework van een Nederlands bedrijf blijkbaar, de volgende spreker had het daar ook over.
Voor de koffie-pauze hadden we nog een Nederlandse Apache en Java-guru op het programma; Ate Douma van Hippo. Hippo is een Nederlands bedrijf dat een open source CMS heeft en sinds kort ook een Portal oplossing. Moet hem straks nog eens aanspreken over wanneer hij vindt dat Portal-technologie ingezet moet/ kan worden. Zijn voorbeeld was alleszins ook weer voor een typisch intranet. Hij had het ook over de nieuwe portlet-specificaties (maar eentje onthouden; portlets asynchroon laden via ajax).
De mannen van Javablackbelt hebben ons hier op 20 minuten een cursus Hibernate gegeven. En straks proberen ze dat opnieuw, maar dan met Spring. Waarom ze dat doen? Omdat ze eigenlijk een developer knowledge website hebben, gratis voor developers maar betalend voor normale mensen. Ik snapte er geen bal van en toen ze kwamen vragen of ik een testje wilde komen afnemen (waarmee een blauw t-shirt te winnen viel) heb ik vriendelijk bedankt. Thomas en ik gaan pachten wel verplichten om zijn (verstofte) java-kennis te bewijzen 😉
Microsoft probeert ons nu, bij monde van Gunter Staes, te overdonderen met het gemak waarmee met Xaml, WPF, Ajax, Blend (een editor voor rich internet applications, beetje tegenhanger van flash/flex. De demo’s zijn straf, die Silverlight lijkt een krachtige plugin. Maar waarom naast Flash nog iets anders gebruiken? Beats me..
Terwijl de wireless hier wegviel, verliet Gunter Staes het podium en nam Noel Jaffré van Fatwire over. Hij had het over sattelite caches. Eigenlijk beschreef hij hier een door Fatwire gepatenteerde oplossing waarbij op ‘sattelite servers’ pagina componenten gecached worden ipv hele pagina’s. Niet helemaal duidelijk, maar lijkt erop neer te komen dat die sattelite servers eigenlijk minimale Fatwire presentatie logica bevatten en dat die, als een component niet beschikbaar is, dat aan het achterliggende systeem gaan vragen. Niet slecht, maar geen rocket science ook?
En dat was het voor mij, ik laat de Spring-cursus (zijn zelfs 2 sessies over) aan mij voorbijgaan. En de slides over GWT krijg ik wel, hopelijk.

Cache header magic (or how I learned to love http response headers)

Is your site dead slow? Does it use excessive bandwidth? Let me take you on a short journey to the place where you can lessen your worries: the http-response-headers, where some wee small lines of text can define how your site is loaded in cached.
So you’re interested and you are going to read on? In that case let me skip the foolishness (I’m too tired already) and move on to the real stuff. There are 3 types of caching-directives that can be put in the http response: permission-, expiry- and validation-related headers:

  1. Permission-related http response headers tell the caching algorithm if an object can be kept in cache at all. The primary way to do this (in HTTP/1.1-land) is by using cache-control:public, cache-control:private or cache-control:nocache. Nocache should be obvious, private indicates individual browser caches can keep a copy but shared caches (mainly proxies) cannot and public allows all caches to keep the object. Pre-http/1.1 this is mainly done by issuing a Last-Modified-date (Last-Modified; although that in theory is a validation-related cache directive) which is set in the future.
  2. The aim of expiry-related directives is to tell the caching mechanism (in a browser or e.g. a proxy) that upon reload the object can be reused without reconnecting to the originating server. These directives can thus help you avoid network roundtrips while your page is being reloaded. The following expiry-related directives exist: expires, cache-control:max-age, and cache-control:s-maxage. Expires sets a date/time (in GMT) at which the object in cache expires and will have to be revalidated. Cache-control:Max-age and Cache-control:s-maxage (both of which which take precedence if used in conjunction with expires) define how old an object may get in cache (using either the ‘age’ http response header or calculating the age using (Expires – Current date/time). s-maxage is to be used by shared caches (and takes precedence over max-age there), whereas max-age is used by all caches (you could use this to e.g. allow a browser to cache a personalised page, but prohibit a proxy from doing so). If neither expires, cache-control:max-age or cache-control:s-maxage are defined, the caching mechanism will be allowed to make an estimate (this is called “heuristic expiration“) of the time an object can remain in cache, based on the Last-Modified-header (the true workhorse of caching in http/1.0).
  3. Validation-related directives give the browser (or caching proxy) a means by which an object can be (re-)validated, allowing for conditional requests to be made to the server and thus limiting bandwith usage. Response-headers used in this respect are principally Last-Modified (date/timestamp the object was … indeed modified the last time) and ETag (which should be a unique string for each object, only changing if the object got changed).

And there you have it, those are the basics. So what should you do next? Perform a small functional analysis of how you want your site (html, images, css, js, …) to be cached at proxy or browser-level. Based on that tweak settings of your webserver (for static files served from the filesystem, mostly images, css, js) to allow for caching. The application that spits out html should include the correct headers for your pages so these can be cached as well (if you want this to happen, off course). And always keep in mind that no matter how good you analyze your caching-needs and how well you set everything up, it all depends on the http-standards (be it HTTP/1.0 or 1.1) the caching applications follows (so you probably want to include directives for both HTTP/1.0 and 1.1) and how well they adhere to those standards … Happy caching!
Sources/ read on:

(Disclaimer: there might well be some errors in here, feel free to correct me if I missed something!)