Mobile Ajax

Mobile AjaxMobile Ajax

Master Thesis in Applied Information Technology

Magisterexamen med inriktning mot tillämpad informationsteknik Januari 2008, Institutionen för tillämpad ITKungliga Tekniska Högskolan

1

Inledning Problemställning Genomförande Diskussion och slutsatser

Presenteras av Mahmud och HaydarKTH - Institutionen för tillämpad IT

Inledning Problemställning Genomförande Diskussion och slutsatser

Presenteras av Mahmud och HaydarKTH - Institutionen för tillämpad IT

AgendaAgenda

2

Web 2.0Web 2.0

Är ett samlingsnamn för nästa generation av webbtjänster. t. ex. Wikipedia.

För att en webbsida ska definieras som Web 2.0 måste den bl. a. uppfylla följande villkor: Att användarna skall kunna:

- bidra till sajtens innehåll- ha kontroll över sin information

designen ska vara interaktiv och användbar

Är ett samlingsnamn för nästa generation av webbtjänster. t. ex. Wikipedia.

För att en webbsida ska definieras som Web 2.0 måste den bl. a. uppfylla följande villkor: Att användarna skall kunna:

- bidra till sajtens innehåll- ha kontroll över sin information

designen ska vara interaktiv och användbar 3

Web 2.0 principerWeb 2.0 principer

Tim O’Reilly sju grundläggande principer för Web 2.0 är:

• Tjänster på Webben istället för de traditionella applikationer.• Att användarna kan skapa & redigera webbens innehåll.• Att ha en databas som inte ägs av tillverkaren.• Att uppdateringar sker utan attskickas till användarna.• Tjänster bygger på Ajax & RSS, automatiskt leverans av information.• Kan köras på vilken dator som helst.• Underlättar hantering av tjänster för användaren.

• Tjänster på Webben istället för de traditionella applikationer.• Att användarna kan skapa & redigera webbens innehåll.• Att ha en databas som inte ägs av tillverkaren.• Att uppdateringar sker utan attskickas till användarna.• Tjänster bygger på Ajax & RSS, automatiskt leverans av information.• Kan köras på vilken dator som helst.• Underlättar hantering av tjänster för användaren. 4

Mobile Web 2.0Mobile Web 2.0

“Mobile Web 2.0 is focused on the user as the creator and consumer of content ‘at the point of inspiration’ and the mobile device as the means to harness collective intelligence” [Jaokar & Fish, 2006]

Utnyttja kollektiv intelligens

Användaren är både skaparen och konsumenten av innehållet och den mobila enheten är ett hjälpmedel för att utnyttja den kollektiva intelligensen.

“Mobile Web 2.0 is focused on the user as the creator and consumer of content ‘at the point of inspiration’ and the mobile device as the means to harness collective intelligence” [Jaokar & Fish, 2006]

Utnyttja kollektiv intelligens

Användaren är både skaparen och konsumenten av innehållet och den mobila enheten är ett hjälpmedel för att utnyttja den kollektiva intelligensen. 5

Mobile Web 2.0 principerMobile Web 2.0 principer

Användargenererat material m.h.a. t.ex. Moblogging

Ersätta alla nummer med taggar/nyckelord.

Taggat innehåll ger möjlighet till mångspråkighet.

Sammansmältning av media (ljud, bild, video, TV) och Mashups.

Mobil access till webbapplikationer Lokaliseringsbaserade tjänster

Söka info. via mobilen t.ex. Eniro

Användargenererat material m.h.a. t.ex. Moblogging

Ersätta alla nummer med taggar/nyckelord.

Taggat innehåll ger möjlighet till mångspråkighet.

Sammansmältning av media (ljud, bild, video, TV) och Mashups.

Mobil access till webbapplikationer Lokaliseringsbaserade tjänster

Söka info. via mobilen t.ex. Eniro

Jaokar och Fish har sammanfattat sju grundläggande principer för Mobile Web 2.0 enligt följande:

6

Ajax Ajax

Ajax (Asynchronous JavaScript and XML):

En användbar teknik för utveckling av Web 2.0 tjänster.

Ajax är inte ett programmeringsspråk, utan ett samlingsnamn för några tekniker som används för att utveckla webapplikationer.

Den hämtar information löpande från servern utan omladdning.

Webbplatsen blir mer interaktiv.

Ajax (Asynchronous JavaScript and XML):

En användbar teknik för utveckling av Web 2.0 tjänster.

Ajax är inte ett programmeringsspråk, utan ett samlingsnamn för några tekniker som används för att utveckla webapplikationer.

Den hämtar information löpande från servern utan omladdning.

Webbplatsen blir mer interaktiv. 7

Ajax teknologierAjax teknologier

HTML/XHTML och CSS för standardbaserad presentation.

XML och XSLT för datautväxling och manipulation.

JavaScript för att dynamiskt binda ihop allt.

DOM för dynamiskt utseende och interaktion.

XMLHttpRequest för asynkron datahämtning.

HTML/XHTML och CSS för standardbaserad presentation.

XML och XSLT för datautväxling och manipulation.

JavaScript för att dynamiskt binda ihop allt.

DOM för dynamiskt utseende och interaktion.

XMLHttpRequest för asynkron datahämtning. 8

Mobile AjaxMobile Ajax

Mobil access till webbapplikationer t.ex. Gmail.

Mobile Ajax är en specialisering av Ajax principer för att applicera tekniken på mobiltelefoner och alla begränsade enheter som har webbläsaregenskaper, såsom spelkonsoler och digitalboxar.

Mobil access till webbapplikationer t.ex. Gmail.

Mobile Ajax är en specialisering av Ajax principer för att applicera tekniken på mobiltelefoner och alla begränsade enheter som har webbläsaregenskaper, såsom spelkonsoler och digitalboxar.

9

Mobile Ajax teknologierMobile Ajax teknologier

Mobile Ajax uppsättningsteknologier skiljer i stort sett inte så mycket från teknologierna som används vid standard Ajax-utveckling.

Det krävs minst stöd för: XMLHttpRequest (XHR), JavaScript och DOM (eller innerHTML). CSS-stilmallar kan även användas för att t.ex. formatera text .

Mobile Ajax uppsättningsteknologier skiljer i stort sett inte så mycket från teknologierna som används vid standard Ajax-utveckling.

Det krävs minst stöd för: XMLHttpRequest (XHR), JavaScript och DOM (eller innerHTML). CSS-stilmallar kan även användas för att t.ex. formatera text .

Ajax

Mobile Ajax

10

ProblemställningProblemställning

1. Kan Mobile Ajax göra mobila webbapplikationer mer användarvänliga, dynamiska och interaktiva?

2. Vilka funktionaliteter i Mobile Ajax underlättar utvecklingen av mobila webbapplikationer?

3. Vilka krav ställer Mobile Ajax på mobila enheter?

4. Vilka fördelar och nackdelar har Mobile Ajax jämfört med Java ME och Flash Lite?





11

Utveckling av en Ajaxbaserad chatt-applikation (IM) till mobila enheter.

Utveckling av en Java ME versionUtveckling av Flash Lite versionTester på några mobila enheter.

Utveckling av en Ajaxbaserad chatt-applikation (IM) till mobila enheter.

Utveckling av en Java ME versionUtveckling av Flash Lite versionTester på några mobila enheter.

GenomförandeGenomförande

12

Use CaseUse Case

13

Mobile Ajax Instant MessengerMAIM – DEMO

www.mobileajax.se/maim

Mobile Ajax Instant MessengerMAIM – DEMO

www.mobileajax.se/maim

http://www.testiphone.com14

http://www.testiphone.com/

AktivitetsdiagramAktivitetsdiagram

15

Verifiering av användarnamnet

Verifiering av användarnamnet

16

TestenheterTestenheter

Enhet Webbläsare

Nokia 6610 Navigator Web Browser for S60

Sony Ericsson P990i Opera 8.60 for symbian OS

Nokia 5500 S60 NGBrowser 3.00

Nokia N73 Opera 8.65 for S60 3.x Ver:8.65

Nokia N70 Web Browser for S60

Sony Ericsson T650 NetFront 3.3

Sony Ericsson K800i NetFront

Nokia 6280 WAP 2.0/xHTML

17

TestresultatTestresultat

SE P990i

Nokia 5500

Nokia 6610

NokiaN73

NokiaN70

SET650

SEK800i

Nokia6280

1. JavaScript Ja Ja Ja Ja Ja Ja Ja Ja

2. try...catch Ja Ja Ja Ja Ja Ja Ja Ja

3. getElementById Ja Ja Ja Ja Nej Ja Ja Nej

4. getElementById RW

Ja Ja Ja Ja Nej Ja Ja Nej

5. innerHTML on DIV Ja Ja Ja Ja Nej Ja Ja Nej

6. XHR Ja Ja Ja Ja Nej Nej Nej Nej

7. XHR Onclick Ja Ja Ja Ja Nej Nej Nej Nej

MAIM Ja Nej Nej Ja Nej Nej Nej Nej18

SlutsatserSlutsatser


Ja. För att användaren behöver inte uppdatera webbsidan själv utan detta sker dynamiskt. Detta medför mer interaktivitet och kortare svarstider. Mobile Ajax bygger på en asynkron kommunikationsmodell, vilket gör mobila webbapplikationer dynamiska och interaktiva. Mycket effektivare än den klassiska webbapplikationsmodellen Kommer i framtiden att prestera ännu bättre än den gör idag. Allt detta gör Mobile Ajax webbapplikationer mer användarvänliga och sparar båda tid och bandbredd.


Ja. För att användaren behöver inte uppdatera webbsidan själv utan detta sker dynamiskt. Detta medför mer interaktivitet och kortare svarstider. Mobile Ajax bygger på en asynkron kommunikationsmodell, vilket gör mobila webbapplikationer dynamiska och interaktiva. Mycket effektivare än den klassiska webbapplikationsmodellen Kommer i framtiden att prestera ännu bättre än den gör idag. Allt detta gör Mobile Ajax webbapplikationer mer användarvänliga och sparar båda tid och bandbredd. 19



Utveckling med befintliga öppna standard webbteknologier som man är redan van vid, såsom JavaScript, XHTML, CSS och DOM.

Detta leder till mindre träning och når ut på marknaden snabbare.

Administrationen och uppdateringen styrs helt från servern.

Bör appliceras i ett noggrant och meningsfullt sätt!(Valet av mobilen och webbläsaren är avgörande)


Utveckling med befintliga öppna standard webbteknologier som man är redan van vid, såsom JavaScript, XHTML, CSS och DOM.

Detta leder till mindre träning och når ut på marknaden snabbare.

Administrationen och uppdateringen styrs helt från servern.

Bör appliceras i ett noggrant och meningsfullt sätt!(Valet av mobilen och webbläsaren är avgörande) 20



En ”modern” webbläsare som har stöd för JavaScript och DOM - Document Object Model eller åtminstone innerHTML stöd, samt XMLHttpRequest.

Våra tester visade att Opera Mobile har bäst stöd för Mobile Ajax.

Vissa Mobile Ajax applikationer t.ex. IM (Instant Messenger) kräver permanent Internetanslutning.


En ”modern” webbläsare som har stöd för JavaScript och DOM - Document Object Model eller åtminstone innerHTML stöd, samt XMLHttpRequest.

Våra tester visade att Opera Mobile har bäst stöd för Mobile Ajax.

Vissa Mobile Ajax applikationer t.ex. IM (Instant Messenger) kräver permanent Internetanslutning.

21



Användarperspektiv- Mobile Ajax kan integreras i befintliga lösningar. - Användaren kan börja eller fortsätta arbeta med sina mobila webbapplikationer, utan att behöva ladda ner eller installera extra programvara på klienten. - Användarens upplevelse ökar på ett interaktivt sätt.- Både Java ME och Flash Lite kräver nedladdning och/eller installationer av programvara. Detta är en lätt uppgift men kan vara en tröskel för nybörjare.


Användarperspektiv- Mobile Ajax kan integreras i befintliga lösningar. - Användaren kan börja eller fortsätta arbeta med sina mobila webbapplikationer, utan att behöva ladda ner eller installera extra programvara på klienten. - Användarens upplevelse ökar på ett interaktivt sätt.- Både Java ME och Flash Lite kräver nedladdning och/eller installationer av programvara. Detta är en lätt uppgift men kan vara en tröskel för nybörjare.

22


Utvecklarperspektiv

- Bättre och kraftfullare mobil- webbutveckling med befintliga standard teknologier.- Lättare att lära sig än Java ME och Flash Lite, som är betydligt svårare och kräver att man både behöver lära sig nya språk och sätta sig in i nya utvecklingsmiljöer.

Utvecklarperspektiv

- Bättre och kraftfullare mobil- webbutveckling med befintliga standard teknologier.- Lättare att lära sig än Java ME och Flash Lite, som är betydligt svårare och kräver att man både behöver lära sig nya språk och sätta sig in i nya utvecklingsmiljöer.

23


Kompatibilitet- Dagens webbläsarna har dåligt stöd för Mobile Ajax.- Java ME applikationer kan köras på enheter som har operativsystem som stödjer Java - Flash Lite applikationer kan köras på operativsystem som har stöd för Flash och har en Flash Player installerad. - Det är underförstått att Java Me och Flash Lite kräver ej en webbläsare.

Kompatibilitet- Dagens webbläsarna har dåligt stöd för Mobile Ajax.- Java ME applikationer kan köras på enheter som har operativsystem som stödjer Java - Flash Lite applikationer kan köras på operativsystem som har stöd för Flash och har en Flash Player installerad. - Det är underförstått att Java Me och Flash Lite kräver ej en webbläsare.

24

Förslag till vidareforskningFörslag till vidareforskning

Mobila webbläsareSäkerheten i Mobile Ajax Jämförande studie:

JavaFX Mobile, Flash Lite och Mobile Ajax.

Mobila webbläsareSäkerheten i Mobile Ajax Jämförande studie:

JavaFX Mobile, Flash Lite och Mobile Ajax.

25

Mobile Ajax

Documents

Transcript of Mobile Ajax