world of javascript
DESCRIPTION
An illustratration on javascript as an evolving platform.TRANSCRIPT
![Page 1: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/1.jpg)
The world of
JavascriptRapee Suveeranont
Web Technology
![Page 2: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/2.jpg)
Falsepopular
belief
![Page 3: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/3.jpg)
SyntaxFeatures
Buzz word
It’s some kind of JAVA
Not in technological terms
CSmalltalkJAVA
No,
![Page 4: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/4.jpg)
Performance is poor
2008 – 2010 Javascript engine warIE 7 →9 = 140XFirefox 3 → 4 = 10X
No, Getting better and better,at even faster speed
![Page 5: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/5.jpg)
Performance is poor
![Page 6: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/6.jpg)
Run (only) in browser
Desktop, Mobile, Server,RIA, Widgets, DB, OS and
Documents
No,it also run in
![Page 7: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/7.jpg)
JavascriptToday
![Page 8: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/8.jpg)
We can do this,var http = require('http'); http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/plain'});res.end('Hello World¥n');
}).listen(8124, "127.0.0.1");console.log('Server running at http://127.0.0.1:8124/');
% node example.js Server running at http://127.0.0.1:8124/
Here comes a web server!
![Page 9: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/9.jpg)
Naked Javascript
Pure programming languageECMAScript
No standard libraryNot even document.write()
No package managementunlike PHP, Ruby, Python
Many engines of choiceRhino, TraceMonkey, Nitro, Chakra, Carakan
![Page 10: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/10.jpg)
Ecosystem
![Page 11: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/11.jpg)
Ecosystem
ECMAScript Language
![Page 12: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/12.jpg)
ECMAScript
JavascriptActionScript
Jscript.NET
QTScript
JScript
Javascript OSA
CajaWMLScript
Objective-J
Language
Dialect
Ecosystem
![Page 13: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/13.jpg)
Language
Dialect
EngineTraceMonkeyNitro
ChakraV8Carakan
Rhino
Ecosystem
![Page 14: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/14.jpg)
Language
Dialect
Engine
Platform
BrowserMobile Desktop
DocumentsDB OS
Widgets
RIA
Ecosystem
![Page 15: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/15.jpg)
Language
Dialect
Engine
Platform
Framework
Client jQuery, Mootools, prototypeYUI, Dojo, Ext, SproutCore
Server CommonJS, Node.js,Narwhal, Jaxer, AppJet
Mobile App Titanium,Phonegap
Ecosystem
![Page 16: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/16.jpg)
LanguageDialectEngine
Platform
Framework
OthersJSON etc.
MongoDBAJAX
CouchDB
Ecosystem
![Page 17: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/17.jpg)
At a glance
![Page 18: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/18.jpg)
JSON. BSON.
{'id': 99,'name': '高橋じゅん','address': [
{'country': 'JP', 'postcode': '144-0012'},{'country': 'TH', 'postcode': '10400'}
],'married': false
}
Very popular light, fast and readable
compact data format
JSON + byte array(binary)
![Page 19: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/19.jpg)
TitaniumNative iPhone/Android
Cross-platform Framework
Appcelerator
![Page 20: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/20.jpg)
Titanium
Titanium.UI.setBackgroundColor('#000');var tabGroup = Titanium.UI.createTabGroup({id:'tabGroup1'});var win1 = Titanium.UI.createWindow({id:'win1'});var tab1 = Titanium.UI.createTab({id:'tab1', window:win1});tabGroup.addTab(tab1);tabGroup.open();
// Display phone’s cameraTitanium.Media.showCamera({
success: function(event) { ... },overlay: overlay,showControls: false,mediaTypes: Ti.Media.MEDIA_TYPE_PHOTO,autohide: false
});
Create native UI with tabs
Open built-in camera
![Page 21: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/21.jpg)
Node.js
var net = require('net');net.createServer(function (socket) {
socket.write("Echo server¥r¥n"); socket.on("data", function (data) {
socket.write(data); });
}).listen(8124, "127.0.0.1");
Server-side applicationFile system, HTTP, SSL, Net, DNS, datagram, process
Open socket and listen to incoming data
![Page 22: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/22.jpg)
CommonJSSpecification of standard API for
non-web application:CLI, Server, GUI
APIs:ModulePackageSystemConsoleFilesystemHTTP ClientEncodings .. etc.
![Page 23: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/23.jpg)
MongoDBNoSQL database with native Javascript query
> db.foo.find({$where : function() {
return this.x == this.y; }
})
> db.eval(function(name) { return "Hello, “ + name;
}, ["Joe"])
SQL: WHERE x = y
OUTPUT: “Hello, Joe”
![Page 24: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/24.jpg)
Why now?
![Page 25: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/25.jpg)
It’s everywhere
WebHTML5+CSS+Javascript, RIA
PlatformDesktop, Mobile, Server, blah, blah, …
DevicePC, Netbook, Garakei, Smartphone, Tablet, Embedded
![Page 26: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/26.jpg)
They’re everywhere
Web DevelopersWeb Designers
Easy to learn, transfer skills, and move to new platform
![Page 27: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/27.jpg)
Cloud
Developers Designers
WebAppSmartphone DesktopRIA
![Page 28: World of javascript](https://reader033.vdocuments.net/reader033/viewer/2022051611/54b7a9934a7959b0218b4639/html5/thumbnails/28.jpg)
Thank you