30
Examensarbete Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap Nivå: B Kurskod: 1DV40E

Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

Examensarbete

Ajax TeknikerPush eller Pull?

Viktor Karlsson2011-06-24Ämne: Examensarbete i DatavetenskapNivå: B Kurskod: 1DV40E

Page 2: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

AbstraktRapporten behandlar ajax-tekniken, en teknik som används för att skicka och hämta

data diskret i dagens webbapplikationer samtidigt som användarupplevelsen och

prestandan förbättras. Fokus ligger på två primära varianter av ajax vid namn push,

pull och syftet är att undersöka varför, när man bör använda teknikerna och hur de

mäter sig emot varandra.

Med intresset för hur dagens mer interaktiva webbapplikationer så som twitter,

google hanterar tekniken så kändes det relevant att undersöka push respektive pull-

tekniken inom javascript.

För att kunna undersöka teknikerna har en webbapplikation i form av en

communitysida skapats med fokus på korrekt implementation av funktioner för

både push och pull-teknik. Applikationen utvecklades med hjälp av ett ramverk vid

namn Websync för att kunna demonstrera när push-tekniken på webben kan vara

lämplig.

Resultatet visar att det är viktigt att tänka på var man implementerar de olika

teknikerna och varför. En prestandamätning från en tidigare undersökning togs med

och skärmdumpar illustrerar några funktionerna i applikationen.

Page 3: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

AbstractThis report deals with the ajax-technique, a technique used to send and retrieve

information discretely within todays webapplications while at the same time

improving performance and the overall user experience. We focus on two main ajax

solutions, push and pull and why you should utilize these techniques and how they

stand against each other in performance benchmarks.

With an interest regarding todays more interactive webapplications such as twitter,

google and how they handle the ajax technique, it felt relevant to research push and

pull within javascript.

A webapplication with focus on correct push and pull implementation was

developed in the shape of a community site to be able to research the different

techniques. The application was developed with the help of the Websync

framework to demonstrate just how the push-technique could be used correctly.

The results show that it is important to note where you are implementing the

different techniques and why. A performance test from an earlier report is included

along with screen-shots that illustrates how some of the functions within the

application work.

Page 4: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

FörordProjektet uppkom främst på grund av ett personligt intresse för ajax-tekniken och

chansen att titta närmare på hur man bör hantera den i olika situationer. En annan

bidragande faktor var ett tidigare arbete i skolan där implementationen av en mer

dynamisk webbapplikation hade underlättat ordentligt för både användare och

utvecklare men där kunskapen saknades för att genomföra det.

Idén bakom applikationen i sig är att få påbörja en communitysida på rätt sätt med

fokus på ett antal olika tekniker samt att för chansen att fördjupa sig inom just ajax.

Page 5: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

InnehållsförteckningAbstrakt .......................................................................................................................... 2

Abstract ........................................................................................................................... 3

Förord ............................................................................................................................. 4

Innehållsförteckning ...................................................................................................... 5

1.Bakgrund ..................................................................................................................... 7

1.1 Pull-teknologi .................................................................................................. 7

1.2 Push–teknologi ................................................................................................. 9

1.3 Tidigare forskning .......................................................................................... 10

1.4 Problemformulering ...................................................................................... 11

2.Metod ......................................................................................................................... 12

2.1Metoddiskussion ............................................................................................. 13

3.Resultat ...................................................................................................................... 14

3.1 Applikationen i sin helhet ............................................................................... 14

3.2 Ledande ramverk inom push-teknik ............................................................... 14

3.3 Användningsområden med pull-teknik ........................................................... 15

3.4 Användningsområde med push-teknik ........................................................... 17

3.5 Implementationsfakta från push och pull ....................................................... 18

4.Slutsats ....................................................................................................................... 20

5.Källförteckning .......................................................................................................... 22

5.1Elektroniska källor .......................................................................................... 22

6.Bilagor ........................................................................................................................ 25

6.1Bilaga 1: Applikationen i sin helhet ................................................................ 25

6.2Bilaga 2: Chatt ................................................................................................ 26

6.3Bilaga 3: Forum .............................................................................................. 26

6.4Bilaga 4: Klotterplank ..................................................................................... 27

6.5Bilaga 5: Nyheter ............................................................................................ 28

6.6Bilaga 6: Sökfunktion ...................................................................................... 29

6.7Bilaga 7: Registrering, Inloggning .................................................................. 29

Page 6: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap
Page 7: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

1. BakgrundUnder de senaste åren har informationsflödet på webben växt något enormt med

tjänster som twitter, youtube och google där stora mängder information

transporteras hela tiden. Efterfrågan av mer lättillgängliga, användarvänliga

applikationer ökar samtidigt som hårdare krav ställs på applikationerna där de

förväntas vara snabba och väl optimerade.

Det blir allt mer vanligt att man vill uppdatera specifik information på hemsidor

utan att för den delen uppdatera eller ladda om hela sida och på så sätt både

förbättra användarupplevelse men även vinna prestanda i applikationen.

En teknik som ofta nyttjas när man vill uppdatera en mindre del på en sida är

Ajax1(”Asynchronous JavaScript and XML”). I grund och botten innebär Ajax att

man kan prata med servern i bakgrunden utan att ladda om sidan för användaren

och på så sätt vinna både prestanda och användarvänlighet.

Namnet ”Ajax” myntades av Jesse James Garret 2(A New Approach to Web

Applications , 2005) men tekniken har funnits sedan 1999 i mindre utsträckning.

1.1 Pull-teknologi När en applikation genomför en så kallad ”pull” etableras en anslutning med

förfrågan om data mellan webbläsaren(klienten) och 3webbservern. Klienten tar i

det här fallet kontakt med servern för att sedan invänta ett svar.

Tekniken lämpar sig att använda när man inte behöver uppdatera data i korta

intervaller och vill förhindra att sidan laddas om . Exempel på en sådan situation

kan vara vid visning av kommentarer eller om man vill skicka formulärdata vid en

registrering. Tekniken går under samlingsnamnet pull 4(”Pull-Technology”) men har

även kallats för 5polling.

_____________________________

1 http://en.wikipedia.org/wiki/Ajax_(programming) , [2011-05-13]

2 http://adaptivepath.com/ideas/ajax-new-approach-web-applications , [2011-05-13]

3 http://sv.wikipedia.org/wiki/Webbserver . [2011-05-13]

4 http://en.wikipedia.org/wiki/Pull_technology , [2011-05-13]

7

Page 8: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

5 http://en.wikipedia.org/wiki/Polling_(computer_science) , [2011-05-13]

Figur 1

Figur 1 illustrerar hur ett anrop görs till servern där klienten sedan hämtar data som

finns tillgänglig, processen repeteras sedan om och om igen klienten vi vet alltså

egentligen inte om ny data finns.

En variant av poll-tekniken är 6Long Polling som fungerar på ett snarlikt sätt, men

istället för att skicka tillbaka redundant data vid varje förfrågan så inväntar server

ny data innan den skickar en respons. Först etableras en anslutning till servern och

sedan inväntas data, om ny data inte är tillgänglig så kör servern en loop(samma

kod körs om och om igen) för att simulera en kontinuerlig anslutning tills dess att

ny data finns tillgänglig. Tekniken lämpar sig att använda vid exempelvis

dynamiska sökningar.

_____________________________

6 http://query7.com/avoiding-long-polling , [2011-05-13]

8

Page 9: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

1.2 Push–teknologi7Comet är en variant av 8push-tekniken som myntades år 2006 av Alex Russel och

är ett samlingsnamn för en rad olika metoder där servern ansvarar för att trycka ut

information till webbläsarna(klienterna) istället för vise versa som i en pull-

applikation. En klient kan därför ansluta till servern och lyssna på en kanal, när data

blir tillgänglig trycks den ut till alla klienter som ligger och lyssnar på den specifika

kanalen likt en radio.

Tekniken är användbar då man har behovet att kontinuerligt uppdatera

informationen på sidan med korta intervaller samtidigt som man vill ha bra

prestanda och korta svarstider. Exempel på en sådan applikation är en chatt där vi

hela tiden måste förvänta oss att något har hänt.

Figur 2

Figur 2 illustrerar en lösning med Comet där en anslutning öppnas och data sedan

kan transporteras mellan klienten och servern i en ström tills dess att den stängs.

_____________________________

7 http://en.wikipedia.org/wiki/Comet_(programming) , [2011-05-14]

9

Page 10: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

8 http://en.wikipedia.org/wiki/Push_technology , [2011-05-14]

Mer information om push och pull-tekniken finns att läsa om i följande artiklar:

Kevin Nilson.(2008).Developers Pushing Data to the Browser with

Comet.developer.com [Online tidskrift]. Tillgänglig:

http://www.developer.com/tech/article.php/10923_3756841_2/Pushing-Data-to-the-

Browser-with-Comet.htm [2011-05-14]

Engin Bozdag, Ali Mesbah and Arie van Deursen.(2007).A comparsion of push and

pull techniques for ajax.archfinch.com [Online tidskrift].Tillgänglig:

http://archfinch.com/item/21bn8/a-comparison-of-push-and-pull-techniques-for-

ajax-pdf [2011-05-10]

1.3 Tidigare forskningMätningen nedan jämför vilken teknik av push och pull som tar upp mest

bandbredd genom att mäta olika antal meddelanden per sekund för olika

överföringshastigheter på ett och samma system.

Figur 3

Figur 3 är hämtad från artikeln 9”Comet is Always Better Than Polling” och visar

resultatet av en mätning mellan push och pull-tekniken. De sträckande staplarna

10

Page 11: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

representerar push(comet) medan de helfärgade visar pull(polling). Resultatet visar

att comet drar betydligt mindre bandbredd och som värst fungerar som reguljär

polling.

1.4 Problemformulering Varför och när bör man implementera ajax och vad avgör om man väljer push eller

pull-teknik som tillvägagångssätt.

Vid implementation av ajax och dess push eller pull-tekniker är det viktigt att tänka

över varför man just implementerar den valda tekniken och vad man vinner på att

välja den ena framför den andra tekniken både användarmässig men även i

prestanda.

Ett stort problem med tekniken uppstår när man vill simulera ett konstant flöde

mellan användaren och servern, det vill säga när användarens webbläsare även

känd som klienten förväntar sig kontinuerligt uppdaterad data från servern.

Problemet innebär alltså att vi kommer få stora prestandaproblem då vi behöver

upprätta nya anslutningar för varje förfrågan om ny data. Vilken teknik väljer vi då

för att handskas med problemet?

Allt för ofta implementeras ajax i större mån just för att det är ajax istället för att

uppfylla ett nödvändigt syfte och därför kommer vi titta närmare på följande

frågeställningar.

När bör ajax implementeras i applikationen?

Vad finns det för olika Comet lösningar på marknaden?

Vilket val av teknik görs inom ajax och varför?(push eller pull)

Hur lång tid tog det att implementera push respektive pull?

_____________________________

9 http://cometdaily.com/2007/11/06/comet-is-always-better-than-polling/ [2011-05-

14]

11

Page 12: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

2. MetodFör att undersöka när ajax bör implementeras med de olika teknikerna så skapas en

applikation som har behovet av obruten kommunikation(chatt) och tillfällig

kommunikation.(klotterplank, kommentarer och sökning)

För att kunna implementera push och comet i en applikation behövs ett 10ramverk

som stödjer tekniken om man inte har för avsikt att egenutveckla en lösning. En

egenutvecklad lösning är både tids och resurskrävande samtidigt som det redan

finns en mängd ledande ramverk på marknaden. 11Websync, 12APE och 13

Migratory-Pushserver är alla ledande inom push-tekniken och stödjer olika

lösningar för Comet.

För att avgöra vilka fördelar som dessa ramverk har att erbjuda tittar vi närmare på

deras lösningar och vad de har att erbjuda, vilket senare tas upp i resultatet.

Valet av ramverk föll på Websync på grund av sitt lättintegrerade stöd för 14IIS7(Internet Information Services) som i sin tur är webbservern som kommer

användas lokalt i applikationen. Websync stödjer dessutom 15PHP som kommer att

ansvara för serverspråket. Ramverket är uppbyggd med hjälp av 16Javascript och 17xhtml som också används för att implementera pull-tekniken med ajax.

Utvecklingsverktyg som används är 18Zend Studio 8 för koden, 19EasyPHP för

databas administration, 20Google Code för versionshantering samt 21MySQL som

databashanterare.

_____________________________

10 http://en.wikipedia.org/wiki/Web_application_framework , [2011-05-14]

11 http://www.frozenmountain.com/websync , [2011-05-14]

12 http://www.ape-project.org/ , [2011-05-14]

13 http://migratory.ro/migratory-push-server.html , [2011-05-14]

14 http://www.iis.net/overview , [2011-05-14]

15 http://www.php.net/ , [2011-05-14]

16 http://sv.wikipedia.org/wiki/Javascript , [2011-05-14]

17 http://sv.wikipedia.org/wiki/HTML , [2011-05-14]

12

Page 13: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

18 http://www.zend.com/en/solutions/ , [2011-05-14]

19 http://www.easyphp.org/ , [2011-05-14]

20 http://en.wikipedia.org/wiki/Google_Code , [2011-05-14]

21 http://sv.wikipedia.org/wiki/Mysql , [2011-05-14]

För att undersöka hur lång tid det tog att implementera push, pull så bedöms de

efter tid, kunskap och verktyg. Hur lång tid tog det att implementera tekniken,

vilken kunskap behövdes och vilka resurser krävdes?

När man bör implementera de olika teknikerna undersöks med hjälp av den

praktiska implementationen där fokus ligger på användarupplevelsen och

prestandan.

Slutligen så undersöks prestandan med hjälp av tidigare artiklar och tester, det vill

säga vad skiljer de olika teknikerna ifrån varandra och vad vinner man på att

implementera push framför pull eller vise versa.

2.1 MetoddiskussionGenom att implementera praktiskt visuella exempel ser man hur ajax fungerar både

användarmässigt och prestandamässigt. Det är helt enkelt en metod som lämpar sig

eftersom man snabbt bildar sig en uppfattning för hur tekniken fungerar oavsett

kunskap.

Bristen med metoden faller på prestandamätningen eftersom man förlitar sig på

externa källor. Det bästa hade givetvis varit om man genomfört komplexa

prestandatest själv men tyvärr fanns inte tiden till detta.

13

Page 14: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

3. Resultat

3.1 Applikationen i sin helhetWebbapplikationen (se bilaga 6.1) innehåller följande implementerade delar:

• Chatt (se bilaga 6.2)

• Forum (se bilaga 6.3)

• Klotterplank (se bilaga 6.4)

• Nyheter (se bilaga 6.5)

• Sökfunktion (se bilaga 6.6)

• Registrering, Login (se bilaga 6.7)

3.2 Ledande ramverk inom push-teknikInom push-tekniken finns ett gäng ledande ramverk som listas nedan. Ramverken

som har tagits med i resultatet erbjuder alla ett par olika lösningar som ligger i

framkant för ajax, comet och push-teknik.

• Ajax push engine – Open source comet solution

Utvecklad sedan 2006 med öppen källkod och ledande push-teknik. Stöd för alla

webbläsare, mobilaplatformer och operativsystem som linux, windows och

macOs.

• Migratory push server – Scaleable comet solution

Migratory världens mest skalbara comet/stream lösning. Låg bandbredd, snabb

överföringshasting med stöd för mobilaplatformer. Utvecklad sedan 2004 med

fokus på många användare och hög prestanda.

• Frozenmountain websync

Stöd för alla stora programmeringsspråk som PHP, C#, ASP och är kompatibel

med Microsoft IIS7 webbserver.

14

Page 15: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

3.3 Användningsområden med pull-teknikResultatet nedan visar en serie med bilder som illustrerar när ajax pull-teknik kan

användas för att förbättra användarupplevelsen.

Figur 4

Figur 4 visar hur användaren klickar på knappen ”Comments” för att visa

kommentarer i applikationen. Tekniken pull används för att uppnå resultatet.

Figur 5

Figur 5 visar en ikon som indikerar att data laddas in på en specifik plats på sidan.

15

Page 16: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

Figur 6

Figur 6 visar ett markerat område vars innehåll har förändrats utan att ladda om sidan.

Figur 7

Figur 7 visar hur en sökning görs på ordet ”ca” och med hjälp av long polling-

tekniken etableras en simulerad dataström som stängs om ett resultat hittas.

Anslutningen hålls öppen i runt 30 sekunder om ingen data returneras.

Figur 8

16

Page 17: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

Figur 8 illustrerar hur sökresultatet visas direkt för användaren i realtid medan

något skrivs i sökfältet. Data har returnerats till användaren och anslutningen

stängs.

Figur 9

I figur 9 från applikationen etableras en anslutning var tionde sekund mot servern

och data hämtas om och om igen oavsett om den är ny eller gammal. Tekniken som

används kallas för polling, en konstant förfrågan om ny data sker med intervaller.

3.4 Användningsområde med push-teknikEn chattapplikation som utvecklats med hjälp av push-tekniken och ramverket

websync illustreras nedan där två användare kommunicerar via chatten.

17

Page 18: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

Figur 10

Figur 11

Figur 10 och 11 från applikationen visar ett chattsystem där två användare

kommunicerar direkt med hjälp av push-teknik inom websyncs ramverk. Data

trycks ut till klienterna direkt utan någon polling.

3.5 Implementationsfakta från push och pull Tabellen visar fakta från en push- och en pullfunktion som finns med i

applikationen. Vilken teknik det är, vilken funktion det gäller samt tid,

kunskapskrav och verktyg som krävdes vid implementation.

Teknik Funktion Tid Kunskapskrav Verktyg

Pull Kommentarer 1 dag Javascript

PHP

Texteditor

easyPHP

Push Chattsystem 1 vecka Javascript

PHP

Websync

IIS7

Texteditor

IIS7 server

PHP

installation

Websync

18

Page 19: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

Figur 12

19

Page 20: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

4. SlutsatsNär bör ajax användas?

När information på sidan troligtvis förändrats, exempelvis om användaren läst en

nyhet så kan ett flertal kommentarer ha lagts till. Då kan alltså vara en bra ide att

implementera ajax för att underlätta för användaren(figur 4-6) och vinna prestanda i

och med att hela sidan inte behöver laddas om.

Vid korrekt implementation vinner vi prestanda i och med att hela sidan inte

behöver laddas om, men samtidigt så förlorar vi exempelvis möjligheten att lägga

till bokmärke och använda bakåt knappen när vi gjort något med ajax. Det i sin tur

kan resultera i en obehaglig användarupplevelse om man försöker gå bakåt i

historiken eller spara ett bokmärke vid något som är hämtat med hjälp av ajax.

Push eller pull?

Med hjälp av prestandamätningen(figur 3) kan man se att push-tekniken vid namn

Comet drar betydligt mindre bandbredd för varje mängd data som skickas än sin

motpart pull-tekniken det vill säga polling och att Comet i värsta fall fungerar

precis som Polling. Så om behovet finns för ett konstant flöde av information(tex.

chatt) så finns det igen anledning att implementera Polling om man har tillgång och

kapacitet att köra Comet.

Med Comet får man ingen redundant data det vill säga endast när det är nödvändigt

så trycks ny information ut vilket resulterar i mindre onödig trafik och snabbare

överföringshastigheter.

Oavsett vilken teknik man valt så bör Push och Pull implementeras varsamt och

endast när man har behov av flödande information mellan klienter och serverar.

Nackdelar med Push

Nackdelarna kring Comet är att tekniken tar lång tid att implementera, man måste

skaffa sig kunskap inom det ramverk som man valt. Förutom det behövs

datorkapacitet för att driva servrar och pengar för att köpa eventuella licenser.

Nackdelar med Polling

20

Page 21: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

Klotterplanket(figur 9) illustrerar hur ajax kan missbrukas med polling, var tionde

sekund uppdateras klotterplanket oavsett om något postat eller inte vilket orsakar

många anslutningar per användare och redundant data nästan hela tiden.

Ramverk på marknaden

Ramverken Migratory, APE, Websync ligger alla i framkant för utvecklingen av

ajax baserade push lösningar, med stöd för att trycka ut data till allt från mobila

platformar till vanliga webbapplikationer bidrar de till vad som förmodligen är

framtiden inom den dynamiska och användarvänliga webben. Applikationer som

twitter och google är bara några exempel på sidor som använder sig av push-

tekniken på webben och ramverk som dessa.

Hur lång tid tog det att implementera?

Implementationen av Pull-tekniken är snabb och enkelt, förutsatt att man har

grundläggande kunskaper inom webbprogrammering. Det krävs inga specifika

programvaror, licenser eller servrar och vem som helst kan implementera det utan

att behöva lägga ner stora resurser och efterforskningar på området.

I applikationen så implementerades kommentarerna, klotterplanket och sökning

med hjälp av pull-tekniken. Varje pull-funktion i applikationen tog cirka 1 dag att

implementera, detta är givetvis relativt till vad det är för funktionalitet som

implementeras och hur omfattande den är.

Jämförelsevis så tog det 1 vecka att implementera liknande funktionalitet med hjälp

av push-tekniken då i form av en webbchatt. Anledningen till att det tog så lång tid

att implementera varje push-funktion berodde till stora delar på att man måste lära

sig ett helt nytt ramverk och anpassa mjukvaran samtidigt som man måste

konfigurera servrar, ha tillgång till dem nödvändiga verktygen och licenserna.

Push-tekniken tar längre tid att implementera och innebär en investering i både

pengar och tid medan Pull-tekniken är helt gratis och går snabbt att implementera

med mindre kunskapskrav.

21

Page 22: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

5. Källförteckning

5.1 Elektroniska källor

Ajax.Wikipedia.org [Webbsida]. Tillgänglig:

http://en.wikipedia.org/wiki/Ajax_(programming) , [2011-05-13]

Ajax: a new approach to web applications. Adaptivepath.com. [Online tidskrift].

Tillgänglig:http://adaptivepath.com/ideas/ajax-new-approach-web-applications ,

[2011-05-13]

Webbserver.Wikipedia.org [Webbsida]. Tillgänglig:

http://sv.wikipedia.org/wiki/Webbserver . [2011-05-13]

Pull technology.Wikipedia.org [Webbsida]. Tillgänglig:

http://en.wikipedia.org/wiki/Pull_technology , [2011-05-13]

Polling (computer science).Wikipedia.org [Webbsida]. Tillgänglig:

http://en.wikipedia.org/wiki/Polling_(computer_science) , [2011-05-13]

Avoiding Long Polling.query7.com [Blogg]. Tillgänglig:

http://query7.com/avoiding-long-polling , [2011-05-13]

Comet (programming).Wikipedia.org [Webbsida]. Tillgänglig:

http://en.wikipedia.org/wiki/Comet_(programming) , [2011-05-14]

Push technology.Wikipedia.org [Webbsida]. Tillgänglig:

http://en.wikipedia.org/wiki/Push_technology , [2011-05-14]

Web application framework.Wikipedia.org [Webbsida]. Tillgänglig:

22

Page 23: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

http://en.wikipedia.org/wiki/Web_application_framework , [2011-05-14]

Websync.Frozenmountain.com [Webbsida]. Tillgänglig:

http://www.frozenmountain.com/websync , [2011-05-14]

Ape-Project.org [Webbsida]. Tillgänglig:

http://www.ape-project.org/ , [2011-05-14]

Migratory-push-server.Migratory.ro [Webbsida]. Tillgänglig:

http://migratory.ro/migratory-push-server.html , [2011-05-14]

Overview.IIS.net [Webbsida]. Tillgänglig:

http://www.iis.net/overview , [2011-05-14]

Php.net [Webbsida]. Tillgänglig:

http://www.php.net/ , [2011-05-14]

Javascript.Wikipedia.org [Webbsida]. Tillgänglig:

http://sv.wikipedia.org/wiki/Javascript , [2011-05-14]

HTML.Wikipedia.org [Webbsida]. Tillgänglig:

http://sv.wikipedia.org/wiki/HTML , [2011-05-14]

Solutions.zend.com [Webbsida]. Tillgänglig:

http://www.zend.com/en/solutions/ , [2011-05-14]

Easyphp.org [Webbsida]. Tillgänglig:

23

Page 24: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

http://www.easyphp.org/ , [2011-05-14]

Google Code.Wikipedia.org [Webbsida]. Tillgänglig:

http://en.wikipedia.org/wiki/Google_Code , [2011-05-14]

Mysql.Wikipedia.org [Webbsida]. Tillgänglig:

http://sv.wikipedia.org/wiki/Mysql , [2011-05-14]

Comet is always better than polling. Cometdaily.com. [Online tidskrift].

Tillgänglig:http://cometdaily.com/2007/11/06/comet-is-always-better-than-polling/

[2011-05-14]

Kevin Nilson.(2008).Developers Pushing Data to the Browser with

Comet.developer.com [Online tidskrift]. Tillgänglig:

http://www.developer.com/tech/article.php/10923_3756841_2/Pushing-Data-to-the-

Browser-with-Comet.htm [2011-05-14]

Engin Bozdag, Ali Mesbah and Arie van Deursen.(2007).A comparsion of push and

pull techniques for ajax.archfinch.com [Online tidskrift].Tillgänglig:

http://archfinch.com/item/21bn8/a-comparison-of-push-and-pull-techniques-for-

ajax-pdf [2011-05-10]

24

Page 25: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

6. Bilagor

6.1 Bilaga 1: Applikationen i sin helhetDen sammansatta vyn visar hur applikationen ser ut i sin helhet.

25

Page 26: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

6.2 Bilaga 2: ChattHär syns det implementerade chattsystem med möjlighet att byta kanal och skicka

meddelande till alla klienter som är anslutna.

6.3 Bilaga 3: ForumForumet innehåller funktioner för att starta och kommentera trådar samt bläddra

bland tidigare resultat.

26

Page 27: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

6.4 Bilaga 4: KlotterplankKlotterplanket erbjuder möjligheten att snabbt skicka och se meddelanden. De fem

senaste meddelandena visas vanligtvis men möjligheten att visa alla finns.

27

Page 28: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

6.5 Bilaga 5: NyheterNyheter med tillhörande möjlighet att visa eller kommentera.

28

Page 29: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

6.6 Bilaga 6: SökfunktionDynamisk sökning med filteringsexempel. Resultat vyn visas under då sökningen

pågår.

6.7 Bilaga 7: Registrering, InloggningRegistrering av användare och möjlighet för användaren att logga in syns.

29

Page 30: Ajax Tekniker Push eller Pull? - DiVA portal434584/FULLTEXT01.pdf · 2011. 8. 15. · Ajax Tekniker Push eller Pull? Viktor Karlsson 2011-06-24 Ämne: Examensarbete i Datavetenskap

351 95 Växjö / 391 82 KalmarTel 0772-28 80 [email protected]