Debugging Javascript

Posted by Anders Carlsen Fri, 12 Feb 2010 20:15:00 GMT

Jeg er blevet træt af at debugge med alert() Det er irriterende at skulle kikke ok hver gang, så nu har jeg lavet mit egen status meddelelsesvindue som jeg blot kan kalde med debug()

div elementet konstruerer jeg først dynamisk hvis det ikke findes i forvejen:
function MakeDebugElm()
{

    var elm = document.createElement("div");
    elm.id = "debug_element";
    elm.style.position = "absolute";
    elm.style.background = "#faa";
    elm.style.bottom = "0";
    elm.style.left = "10px";
    elm.style.size = "14px";
    elm.style.width = "90%";
    elm.style.height = "50px";
    elm.style.overflow = "auto";
    elm.style.zIndex = 5000;
    elm.hide = function() { this.style.display = "none"; };
    elm.show = function() { this.style.display = "block"; };
    elm.onclick = function() { this.style.display = "none"; };    
    var body = document.getElementsByTagName("body").item(0);
    body.appendChild(elm);
    return elm;
}

function debug(str)
{
    d = document.getElementById("debug_element")
    if( d == null)    
            d = MakeDebugElm();

    d.show();
    d.innerHTML = str + "<br />" + d.innerHTML;
}


Del

Posted in ,  | no comments

Logging af klik

Posted by Anders Carlsen Wed, 10 Feb 2010 19:18:00 GMT

Fornyligt fjernede jeg logging af klik på en hjemmeside for dels at få hurtigere og flere sidevisninger , dels for at højne min troværdighed i forhold til Google Bot.

Min gamle strategi

Jeg brugt en teknik hvor jeg ved hjælp af onclick function return false skjulte at når folk klikkede på et link først blev send til en controller som loggede klikket i database inden det blev vidresendt til den ønskede adresse. f.eks.

<a href="http://dr.dk" onclick="window.open('/links/goto/12') ; return false; >

Selvom Google skriver i deres information til webmastere at Google Bot ikke følger javascript, kunne jeg konstatere at det gør den faktisk. Dvs. Google registerede adressen links/goto og ikke dr.dk, hvilket ikke er særligt hensigtsmæssigt. Desuden koster en omdirigering ekstra tid for brugeren og ekstra resurcer på serveren, så jeg valgte at fjerne funktionen og finde en anden strategi.

Nye klik logging strategi

Så jeg tænkte, – hvordan gør Google det?

Ind på Google med Chrome, højreklik og vælg, kontroller element(Googles svar på Firebug)

<a href="http://www.1001line.dk/" class="l" 
onmousedown="return
 clk(this.href,'','','res',
'1','&amp;sig2=Yd8YBx8q77M9QpTMyuWYcw'
,'0CBAQFjAA')"><em>Svendborg Web</em></a>

Aha, så Google bruger onmusedown event til at registrerer hvad brugeren klikker på.

Onmouse down er den event som indtræffer lige når brugeren har klikket inden onclick event indtræffer.

EventListener Jeg ønskede ikke at have onmousdown tilskrevet inline til alle mine links, så jeg skulle bruge noget eventhandling og tænkte at det må jeg kunne gøre med prototype

Så jeg fandt følgende eksempel på http://www.prototypejs.org/api/function/bindaseventlistener

EventListener

var obj = { name: 'A nice demo' };

function handler(e) {
  var tag = Event.element(e).tagName.toLowerCase();
  var data = $A(arguments);
  data.shift();
  alert(this.name + '\nClick on a ' + tag +
    '\nOther args: ' + data.join(', '));
}

Event.observe(document.body, 'click', handler.bindAsEventListener(obj, 1, 2, 3));

(Af en eller anden grund virkede det først for mig da jeg fjernede body fra document.body)

Da det først virkede fik jeg hurtigt omskrevet scriptet så det passer til mit formål.


function handler(e) {
  var tag = Event.element(e).tagName.toLowerCase();
    if(tag == "a"){
        new Ajax.Request('/link_hits/click/?id=' 
                  + Event.element(e).id + "&url=" 
                  + eval('Event.element(e).href').escapeHTML() ,
                   {method: 'get', asynchronous:true, evalScripts:true})
        }
}

Event.observe(document, 'mousedown', handler.bindAsEventListener());

For at spare på serveren ønskede jeg ikke at skrive loggen i databasen men i en logfil, som jeg så efterfølgende kan parse.

Min controller action kom til at se sådan her ud.
def click
   render :nothing => true
    logger = Logger.new("#{RAILS_ROOT}/log/hits.log", 50, 1048576)
    logger.info "#{Time.now}, #{params[:url]}, #{params[:id]}, #{request.remote_ip}" 
  end

Og sådan ser min log info ud:

# Logfile created on Wed Feb 01 15:44:28 +0100 2010 by /
Wed Feb 10 15:44:28 +0100 2010, http://1001lin.dk/, 481, 127.0.0.1
Wed Feb 10 15:48:03 +0100 2010, http://localhost:3000/links/index/217-haandvaerk_byggeri, , 127.0.0.1

Så snart kan mine webstedsbrugere igen bruge links hits siden på mit websted.


Del

Posted in , , ,  | Tags , ,  | no comments

If you can't beat them, join them

Posted by Anders Carlsen Tue, 09 Feb 2010 13:27:00 GMT

Mit vejkort til at blive Facebook applikations udvikler

If you can’t beat ‘em, join ‘em You better do it ‘Cause it makes you feel good – Queen

Facebook har ændret vilkårene på Internettet dramatisk

Lige før sommerferien 2008 besluttede jeg mig for at oprette et login til Facebook. Lige siden da har det været mit foretrukne sted på Internettet. Idag 2010 er stort set alle, som bruger Internettet på Facebook.

Facebook har på dramatisk vis ændret Internettet og den måde vi bruger det på. Og det er en udvikling som vil fortsætte.

På Google Search for Insight kan man danne sig et indtryk ovre udviklingen, ved at sammenligne søgeudtrykket “Facebook” med f.eks. “Google” og “Twitter”.

Diagrammet giver et klart indtryk af hvor dramatisk den rolle Facebook spiller.

Hvis vi ser bort for hele snakken om sociale medier, at Facebbok introdukserer en helt ny måde at bruge nettet på, og kigger på hvilke konsekvenser Facebook har haft for faktorene besøgstal og aktiv internet tid, vil jeg slutte udfra min egen adfærd og mine Facebook venners adfærd, at disse konsekvenser også har været og fortsat vil være dramatiske.

Folk bruger mere tid på nettet, men da væksten i Internetbrugere i danmark er toppet, og da vi fortsat kun har 24 timer i døgnet. Har en af konsekvenserne ved Facebook været at andre websteder må have oplevet stagnerende eller negativ vækst i forløbne to år.

Det er Facebooks skyld

Man kan forestille sig hvordan folkene fra f.eks. Arto og Dating, efter en kort periode at have siddet på en guldgruppe, har haft det når de måned efter måned har se hvordan væksten er stagneret eller faldet de sidste to år.

Ifølge FDMI , er Arto gået fra 433000 måndlige brugere i august 2008 til 231.000 måndlige brugere i august 2009. Der kan være andre faktorer som gør tallene, men tendensen og årsagen er klar. Det er pga. Facebook.

Matthæus effekten

På Internettet som på andre frie markeder gælder Mathæus effekten Google og Facebook vokser og vokser, på bekostning af andre spillere.

Facebook applikations udvikling

Budskabet til websstedsejere og webstedsudviklere er klart. If you can’t beat them, join them

Heldigvis er Facebook meget åben i en positiv forstand. Ok man skal have et login, for at kunne være med. Men Facebook inviterer websteder og webudviklerer med indenfor. Der er rige og muligheder for at joine Facebook ved at lave Facebook applikationer og ved at Integrerer sit websted med Facebook. Man starter med Facebook Udvikler .

Mindre kan også gøre det, ved at benytte sig af muligheden for at oprette Facebook grupper og Facebook profiler.

Facebook støtter Open Source bevægelsen

Facebook er jo lavet med PHP, og Facebook har bidraget med flere udviklingsprojekter til bla. PHP

Generelt virker det som om at danske web-udviklere endnu ikke er vågnet op til realiteterne på nettet. Jeg har dog fundet et firma, Komfo , som ser ud til at have fået fat i den lange hale( long tail).

Selv er jeg for ganske nyligt gået igang med at lære at lave Facebook applikationer med Ruby On Rails og Facebooker som jeg ser som det pt. bedste Rails plugin til Facebook. Så om alt går vel, kan jeg inden længe smykke mig med titlen – Facebook-udvikler . ;-)

Jeg håber snart at kunne dele mine erfaringer her på denne weblog.


Del

Posted in , ,  | Tags , ,  | no comments

Google App Engine med Python

Posted by Anders Carlsen Fri, 29 Jan 2010 12:42:00 GMT

Forleden lavede jeg min første Google AppEngine hello world webapplikations test med Ruby On Rails . Så har jeg gået og tænkt over det lidt. Og havde egentligt tænkt mig at kigge lidt på Googles programmeringssprog Go, men kom i min søgning ind på Google Apps , som førte mig videre til Google App Engine , hvor jeg så gik igang med at prøve at lave en App Engine webapplikation som kan ses her:

http://superkroko.appspot.com/

Webapplikationen er lavet efter en tutorial i hvordan man bruger App Engine med Python.

Python

Min første erfaring med Rail på App Engine via JRuby var at det pt. nok ikke er vejen frem. Måske vil App Engine i fremtiden komme til at understøtte Ruby. Indtil da har jeg som mange andre Ruby-elskere måttet konstatere at det gør App Engine ikke, måske skulle jeg alligevel kigge lidt på Python. For når det kommer til stykket så er Python ikke det værste sprog. Det har mange af de samme fordele som Ruby. Det er et dynamisk script-baseret sprog, og det har et modent og åbent community, og så er det Googles foretrukne sprog. Jeg har iøvrigt brugt det for en del år siden, lang tid før at jeg opdagede Ruby. Python er også mere poplært som programmeringssprog end Ruby. (Google Insight )

App Engine

Efter nu igen at have kigget på App Engine må jeg sige at det virker temmeligt lækkert. Man installere SDK’en og er kørende med det samme. Her har Ruby On Rails noget at lære. Ikke noget bøvl med deployment. Hvis det kører lokalt kører det også på App Engine. Og så er det indbygget versions styring. Tilgengæld savner jeg ActiveRecord som er et af de væsentligste argumenter for Rails. En af grundene til at jeg i første omgang ikke kunne se ideen i Rails på App Engine er at der ikke er understøttelse for Rmagich. Men App Engine med Python bruger Pythons eget image-tool. App Engine er hurtigt og skalerbar. Og tiden er en vigtig faktor. Der er ikke noget der er mere iriterende en at have sit websted på en langsom webserver.

Google og udvikler jobs

Google er et næsten magisk brand og et bussword. Jeg tror ikke at Ruby On Rails har været nogen success hvis det handler om at sælge, ialtfald ikke her i Microsoft Land, Danmark. Tilgengæld tror jeg at Google sælger endnu bedre en Microsoft.

Community

Google har fra starten af været og er stadigt knyttet tæt til Open Source bevægelsen. En af de ting jeg har været glad for ved Ruby On Rails har været kvaliteten af det community som har knyttet sig til Rails. Jeg ved ikke om det er mig der har ændret mig eller om jeg har mistet overblikket. Men det virker som om at der er lidt for meget støj omkring Rails, som om at kvaliteten ikke er vokset i takt med væksten i udbredelse og popularitet, men at det er gået den modsatte vej.


Del

Posted in ,  | Tags , , ,  | no comments

Webmaster og SEO værktøjer - Part 2

Posted by Anders Carlsen Tue, 26 Jan 2010 14:35:00 GMT

I Webmaster og SEO værktøjer – Part 1 fortæller jeg om nogle værktøjer som jeg hjælpe en med at finde baggrundsoplysninger.

Efterfølgende vil jeg nævne andre vigtige værktøjer, som bla handler om keywords og HTML.

Først og fremmest er det vigtigt at skaffe sig en Google Konto, da nogle værktøjer fra Google kræver at man har en konto.

Fra Google

Den vigtigste service er Webmasterværktøjer som kan tilknyttes til ens hjemmeside og giver statistikker, diagnoser og styring af Googles gennemgang og indeksering af dit websted, herunder Sitemap-indseldelse og -rapportering.

Google Analytics er en gratis tjeneste som giver dig en effektiv statestik om dine websteder.

Google Trends kan hjælpe dig til at finde ud af hvilke keywords eller søgeord som har den bedste gennemslagskraft lokalt eller globalt

Goggle Søgeinsigt eller Google Insight for Search som det hedder på engelsk er et lignende værktøj med lidt flere søgemuligheder, som at søge i forskellige sammenhænge, som geografisk lokation og udbredelse eller enmebaseret.

Google Translate eller Google Oversæt kan hjælpe med at oversætte tekster, websteder og dokumenter til en lang række sprog. Fra Dansk til Engelsk. Eller fra Engelsk til Danske.

Fra dansk til Kinesisk : 從丹麥到中國 eller

Fra Dansk til Arabisk: : (skal læses fra højre)من الدانماركية الى العربية

Fra Firefox

Firefox er efter min mening næsten webmasterens vigtigste værktøj når det handler om HTML. Med Firefox har man adgang til tilføjelsen Firebug som giver dig en enestående adgang til at læse en hjemmesides HTML, CSS og Scripts. En nyttig hjælp hvis man skal finde fejl i koden eller finde ud af hvordan et eller andet er lavet. Google Toolbar indholder en række nyttige funktioner eller værktøjer. Bla, Page Rank, som viser rank for det websted du er inde på.

SEO Viden

Det kan være vanskeligt at følge med i Internettes rivende udvikling, men hvis man vil holde sig opdateret med SEO viden, kan den førende danske SEO-Guro Mikkel Demib Svendsens blog anbefales. Selvom der bliver udsendt en del støj fra webloggen kan man ind imellem finde oplysende artikler om ny og gamle SEO begreber.


Del

Posted in ,  | Tags , , ,  | no comments

Google App Engine med Ruby On Rails

Posted by Anders Carlsen Sun, 24 Jan 2010 17:06:00 GMT

Min første applikation på Google App Engine er oppe at køre.
http://bodeval.appspot.com/

Det tog ikke lang tid at sætte det op, da jeg først havde fundet den rigtige vejledning , selvom AppEngine SDK er til Python eller Java. Men med JRuby er og dygtige Rails udviklere, er der for længst fundet løsninger der gør det muligt at køre Rails på AppEngine.

Jeg brugte denne vejledning, Rails 2.3.5 on App Engine .

De sidste par år har jeg ikke rigtigt fulgt med i udviklingen på Internettet og udviklingen af Rails i særdeleshed. Det er et lidt typisk mønster. Da asp toppede ville jeg hellere arbejde med ASP.Net. Da ASP.Net toppede ville jeg hellere arbejde med Ruby On Rails, og i de sidste år hvor Rails er stormet frem, har jeg primært brugt min tid på at passe mine unger og tage en meritlærer-uddannelse.

Så der er en hel del ting jeg skal have fulgt op på med hensyn til Rails. Heldigvis er der næsten altid en god vejledning lige ved hånden.

Database integration er helt sikker en af de ting som jeg skal have fulgt op på for at få en bedre forståelse for hvordan man gør det bedst med Rails i år 2010.

Næste skridt er at jeg vil prøve at lave en Facebook applikation på Google :-)


Del

Posted in , ,  | Tags , ,  | 1 comment

Webmaster og SEO værktøjer

Posted by Anders Carlsen Sat, 23 Jan 2010 11:48:00 GMT

Idag kam man finde ud af meget mere og dit eget eller andres domæner på Internettet, med diverse services.

To danske hjemmesider tilbyder info til webmastere De undersøger dagligt Danske domænenavne og web-servere, informationerne kædes sammen med data fra DK-Hostmaster, Google og andre online databaser

Netnationen har lavet sin egne danske rank så man kan se hvor populær en hjemmeside er. Internetstatestik oplyser om et domænes rank på google. Begge tjenester er nyttige. Selv foretrækker jeg Internetstatestik og har derfor også linket til den fra Århus Web

Internet Archive Wayback Machine er en gammel kendt tjeneste som gemmer hjemmesider tilbage i tiden fra diverse domæner. Men tjenesten bliver ikke mindre interessant som årene går. Man kan finde både nyttige og underholdende indblik i hvordan en hjemmeside har udviklet sig gennem årene.

Min egen hjemmeside 1001line.dk er registreret helt tilbage til 1997

Jeg har også fået et gensyn med mit første relative sucessfulde internetprojekt 1001line.dk VBScript og ASP tilbage til 1999

Tiden er en vigtig faktor også på Internettet. Og en lang histore er nyttigt for et domæne, men fortide kan være en styrke eller en balastning for en domæne eller en hjemmesides troværdighed.

Alexa kan man finde oplysninger om en hjemmesides rang på globalt plan.


Del

Posted in ,  | Tags ,  | no comments

Fra Platon til Web 2.0 om Web Retorik

Posted by Anders Carlsen Fri, 22 Jan 2010 11:30:00 GMT

Fra Platons “tale kunst” eller retorik kan der hentes begreber som kan overføres til og bruges til analyse nutidens vigtigste medie Internettet.

Retorik handler om kunsten af få sit budskab ud til modtageren.

Webretorik handler om hvordan man med en hjemmeside når ud til brugeren med sit budskab.

Kvaliteten af ens retorik kan analyseres udfra 3 begreber: logos, ethos og phatos.

Logos er det logiske, rationelle og fornuftsmæssige. Ethos er afsenderen og budskabets troværdighed. Phatos er den følelsmæssige appel.

De tre begreber er indbyrdes forbundet, og påvirker hinanden og er afgørende for kvaliteten af ens budskabs gennemslagskraft.

Logos * Phatos * Ethos == budskabets gennemsslagskraft

Er et af elementerne meget lille eller negativ, vil det samlede budskabs gennemslagskraft være lille eller negativ.

Webdesign og retorik Webretorik kan bruges til at bedømme en hjemmesides gennemslagskraft.

Logos: Er der tilstrækkelig og væsentlig information når alt layout er pillet fra.

Phatos: Den følelsmæssige appel kan understreges med layout, grafik og billeder. Men er Phatos afstemt med indholdet og appelere det mere til hjemmesidens afsender end det faktisk appelere til de brugere man ønsker at nå.

Ethos: Er hjemmesiden troværdig?. Igen, i forhold til modtageren. Er der for mange reklamebannere, eller er den amatøragtig og fejlbehæftet?

Der kan sikkert koges mere suppe på denne tanke. - Overvejer om jeg skulle købe domænet. webretorik.dk , .. nå det er købt i forvejen, – kan alligevel ikke købe et domæne hvergang jeg skriver et blogindlæg :-)


Del

Posted in ,  | Tags ,  | no comments

Hurtigere og Flere sidevisninger

Posted by Anders Carlsen Fri, 22 Jan 2010 08:48:00 GMT

Jeg har netop opdaget at jeg kan fordoble antallet af sidevisninger pr. session på min hjemmeside Århus Web, ved at fjerne en klik-optællings funktion.

Formålet med funktionen har været at kunne lave en optælling af hvilke links brugerne klikkede på via Århus Web , for dermed at kunne lave en top-liste. Som iøvrigt kan være en rimelig populær funktion.

Jeg har brugt en teknik hvor jeg ved hjælp af onclick først har send brugerne til en intern side som først har registreret klikket i databasen og derefter har vidersendt til den ønskede adresse således.

 <a  href="http://aarhuso.dk" 
  onclick="window.open('/links/goto/link?id=1'); 
  return false;">http://aarhuso.dk</a>

Brugeren vil på den måde kunne se den rigtige adresse ved onmouseover, og således ikke opdage funktionen udover at de altså vil få en langsommere afvikling.

En alternativ teknik kunne laves ved at man indsætter en dynamisk gennereret billed reference eller script nederst i html’en.


Del

Posted in , ,  | Tags  | no comments

Mest populære programmeringssprog

Posted by Anders Carlsen Thu, 21 Jan 2010 21:15:00 GMT

TIOBE Programming Community har udgivet en listen over de for tiden mest populære programmerings sprog.

Java og C ligger suverænt i toppen, skarpt efterfulgt at PHP og C++ .

Det er værd at bemærke at PHP har overhalt C++ .

Jeg kan undre mig over at Ruby ligger så langt nede på listen endnu.

Jeg blev iøvrigt opmærksom på at Google har lavet et programmerings sprog Go Hurtig compiling, næsten lige så hurtigt som C og C++ og føles som dynamiske programmeringssprog (Ruby, Python, PHP) og så er det sjovt at programmere med. (se video promo)

Jeg har kigget på det, men har det sjovt nok med Ruby on Rails , så jeg venter lidt med at prøve det, tror jeg.

    Position
   2010   2009    Programming Language        Vaekst    

    1         1     Java             17.482%     -1.54%       
    2         2     C                 16.215%     +0.28%       
    3         5     PHP             10.071%     +1.19%       
    4         3     C++             9.709%         -0.41%       
    5         4     VB                 7.354%         -1.81%       
    6         6     C#                 5.767%         +0.16%       
    7         7     Python             4.453%         -0.28%       
    8         8     Perl             3.562%         -0.74%       
    9         9     JavaScript         2.707%         -0.65%       
    10         11     Ruby             2.474%         -0.67%       
    11         10     Delphi             2.392%         -0.91%       
    12         37     Objective-C     1.379%         +1.24%       
    13         -     Go                 1.247%         +1.25%       
    14         14     SAS             0.809%         +0.01%       
    15         13     PL/SQL             0.718%         -0.29%       
    16         18     ABAP             0.641%         +0.10%       
    17         15     Pascal             0.624%         -0.04%       
    18         23     Lisp/Scheme     0.576%         +0.14%       
    19         20     ActionScript    0.566%         +0.11%       
    20         24     MATLAB             0.540%         +0.11%       


Del

Posted in  | Tags ,  | no comments

Older posts: 1 2 3 ... 8