Mobile Ajax

Master Thesis in Applied Information Technology
Mobile Ajax
Magisterexamen med inriktning mot tillämpad informationsteknik Januari 2008, Institutionen för tillämpad IT
Kungliga Tekniska Högskolan
1
Agenda




Inledning
Problemställning
Genomförande
Diskussion och slutsatser
Presenteras av Mahmud och Haydar
KTH - Institutionen för tillämpad IT
2
Web 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

3
Web 2.0 principer
Tim O’Reilly sju grundläggande principer för Web 2.0 är:
Webben
som
plattform
Rik
användaru
pplevelse
Program
varan ligger
ovanför
enhetens
nivå
Utnyttja
kollektiv
intelligens
Web 2.0
principer
Lättviktspro
grammering
s-modeller
Data är
nästa Intel
Inside
Slutet på
mjukvarula
nseringscy
kel
• 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 att
skickas 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
4
för användaren.
Mobile 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.
5
Mobile Web 2.0 principer
Jaokar och Fish har sammanfattat sju grundläggande principer för
Mobile Web 2.0 enligt följande:

Mobilinn
ehåll
Mobilsö
kning
Location
Based
Services
(LBS)

Jag är
en tagg
Mobile Web 2.0
principer
Mobile
Ajax &
Mobile
Widgets
Digital
Converg
ence


Mångspr
åkig


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
6
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.
7
Ajax 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.
8
Mobile 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.
9
Mobile 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
Ajax
användas för att t.ex. formatera text .
Mobile
Ajax
10
Problemställning
1.
2.
3.
4.
Kan Mobile Ajax göra mobila
webbapplikationer mer användarvänliga,
dynamiska och interaktiva?
Vilka funktionaliteter i Mobile Ajax
underlättar utvecklingen av mobila
webbapplikationer?
Vilka krav ställer Mobile Ajax på mobila
enheter?
Vilka fördelar och nackdelar har Mobile Ajax
jämfört med Java ME och Flash Lite?
11
Genomförande
Utveckling av en Ajaxbaserad chattapplikation (IM) till mobila enheter.
 Utveckling av en Java ME version
 Utveckling av Flash Lite version
 Tester på några mobila enheter.

12
Use Case
13
Mobile Ajax Instant Messenger
MAIM – DEMO
www.mobileajax.se/maim
14
http://www.testiphone.com
Aktivitetsdiagram
15
Verifiering av
användarnamnet
16
Testenheter
Webbläsare
Enhet
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
Testresultat
SE
P990i
Nokia
5500
Nokia
6610
Nokia
N73
Nokia
N70
SE
T650
SE
K800i
Nokia
6280
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
Ja
Nej
Nej
Ja
Nej
Nej
Nej
Nej
MAIM
18
Slutsatser
1. Kan Mobile Ajax göra mobila webbapplikationer mer
användarvänliga, dynamiska och interaktiva?
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
Slutsatser
2. Vilka funktionaliteter i Mobile Ajax
underlättar utvecklingen av mobila
webbapplikationer?




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
Slutsatser
3. Vilka krav ställer Mobile Ajax på mobila
enheter?



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
Slutsatser
4. Vilka fördelar och nackdelar har Mobile Ajax
jämfört med Java ME och Flash Lite?

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
Slutsatser

Utvecklarperspektiv
- Bättre och kraftfullare mobilwebbutveckling 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
Slutsatser

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 vidareforskning
Mobila webbläsare
 Säkerheten i Mobile Ajax
 Jämförande studie:

JavaFX Mobile, Flash Lite och Mobile Ajax.
25