Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
JavaScript: The Past, Present and Future
Search
Kim Joar Bekkelund
April 17, 2015
Programming
140
0
Share
JavaScript: The Past, Present and Future
An introduction to the role of JavaScript. Given to students at NTNU in Trondheim, Norway.
Kim Joar Bekkelund
April 17, 2015
More Decks by Kim Joar Bekkelund
See All by Kim Joar Bekkelund
ASTs in JavaScript
kimjoar
0
120
Writing Beautiful JavaScript Tests
kimjoar
12
2.7k
WebSockets and Server-Sent Events
kimjoar
1
270
Patterns of Large-Scale JavaScript Applications
kimjoar
20
1.5k
Patterns of Large-Scale JavaScript Applications
kimjoar
22
2.4k
Enkle JavaScript-abstraksjoner
kimjoar
1
200
Simple JavaScript Abstractions
kimjoar
9
800
Introduksjon til forretningsmodeller
kimjoar
2
370
Other Decks in Programming
See All in Programming
How We Practice Exploratory Testing in Iterative Development( #scrumniigata ) / 反復開発の中で、探索的テストをどう実施しているか
teyamagu
PRO
3
810
【ディップ|26年新卒研修資料】TDD実装演習
dip_tech
PRO
0
180
実践ハーネスエンジニアリング:ステアリングループを実例から読み解く / Practical Harness Engineering: Understanding Steering Loops Through Real-World Examples
nrslib
5
5.3k
Skillは並べた。動かなかった。契約で繋いだ。— 65個のSkillから、自走する開発サイクルへ
junholee
0
380
Surviving Black Friday: 329 billion requests with Falcon!
ioquatix
0
3.1k
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
640
空間オーディオの活用
objectiveaudio
0
150
GoogleCloudとterraform完全に理解した
terisuke
1
190
Kingdom of the Machine
yui_knk
2
1.5k
From Formal Specification to Property Based Test
ohbarye
0
2.5k
WebAssembly を読み込むベストプラクティス 2026年春版 / Best Practices for Loading WebAssembly (Spring 2026)
petamoriken
5
1.1k
リセットCSSを1行消したらアクセシビリティが向上した話
pvcresin
4
510
Featured
See All Featured
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
420
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.8k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
65
54k
The Art of Programming - Codeland 2020
erikaheidi
57
14k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.2k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.4k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
190
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.4k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
130
The Illustrated Children's Guide to Kubernetes
chrisshort
51
52k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.5k
Git: the NoSQL Database
bkeepers
PRO
432
67k
Transcript
JavaScript The Past, Present and Future
Kim Joar Bekkelund @kimjoar
[email protected]
Fagleder i JS-plattform Jobbet i
BEKK siden 2011
None
None
It all started at 1995
Brendan Eich + 10 days = JavaScript
What did we do with this new language? (You really
don't want to know)
CUT & PASTE
None
None
None
… and this went on for almost 10 years
2004
2005
What happened?
What happened?
What happened?
What happened?
JavaScript went from nothing to …
"any application that can be written in JavaScript, will eventually
be written in JavaScript." Atwood's Law
JavaScript Where are we now?
We expect more!
None
None
SPA Single-page applications
None
10/90? 50/50? 70/30?
None
None
WebSockets Client Server Set up connection
JavaScript + I/O Single-threaded, non-blocking
None
Node.js in production?
“Assembly language of the web”
None
# Assignment: number = 42 opposite = true # Conditions:
number = -42 if opposite # Functions: square = (x) -> x * x # Arrays: list = [1, 2, 3, 4, 5] # Objects: math = root: Math.sqrt square: square cube: (x) -> x * square x Inspired by Ruby and Python Several features will be added to the next JS version
class Point { x: number; y: number; constructor(x: number, y:
number) { this.x = x; this.y = y; } getDist() { return Math.sqrt( this.x * this.x + this.y * this.y ); } } var p = new Point(3,4); var dist = p.getDst(); console.log("Hypotenuse is: " + dist); Optional static typing. Superset of JS.
data Person = Person { name :: String, age ::
Number } showPerson :: Person -> String showPerson (Person o) = o.name ++ ", aged " ++ show o.age examplePerson :: Person examplePerson = Person { name: "Bonnie", age: 26 } Inspired by Haskell
(ns example (:require [om.core :as om] [om.dom :as dom])) (defn
widget [data owner] (reify om/IRender (render [this] (dom/h1 nil (:text data))))) (om/root widget {:text "Hello world!"} {:target (. js/document (getElementById "my-app"))}) A Lisp for the browser
asm.js Speeding up compiled languages
asm.js Speeding up compiled languages "an extraordinarily optimizable, low-level subset
of JavaScript"
C/C++ -> LLVM -> Emscripten -> asm.js
int f(int i) { return i + 1; } C
function f(i) { i = i|0; return (i + 1)|0; } asm.js
But what happens when you can run C and C++
code in the browser?
None
None
None
millions of lines of C compiled to asm.js/JavaScript running in
a browser !
JavaScript The future
language, apps, ecosystem, VM
LANGUAGE the
ES1 1997 ES2 1998 ES3 1999 ES4 Abandoned ES5 2009
ES6 2015 ES7 est. 2016
Adjustments based on real-world problems
None
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Datainn</title>
<meta name="description" content=""> <meta name="viewport" content="width=device-width"> <script src="../shared/vendor/proj4js/proj4js-compressed.js"></scr <script src="../shared/vendor/bower_components/underscore/undersco <script src="../shared/vendor/bower_components/jquery/jquery.min.j <script src="../shared/vendor/bower_components/spin.js/spin.js"></ <script src="../shared/vendor/bower_components/angular/angular.js" <script src="../shared/vendor/bower_components/angular-route/angul <script src="../shared/vendor/bower_components/angular-animate/ang <script src="../shared/vendor/bower_components/ng-table/ng-table.j <script src="../shared/vendor/bower_components/moment/moment.js">< <script src="../shared/vendor/bower_components/moment/lang/nb.js"> <script src="../shared/vendor/bower_components/based-on/index.js"> <script src="../shared/vendor/bower_components/poller.js/poller.js <script src="../shared/vendor/bower_components/ee.js/ee.js"></scri <script src="../shared/vendor/bower_components/d3/d3.js"></script> <script src="../shared/vendor/bower_components/nvd3/nv.d3.js"></sc
None
ECOSYSTEM the
None
Cryptography API, Audio API, WebRTC, File API …
60fps, but only one thread Web Workers 60fps, but only
one thread
None
from mostly huge frameworks to thousands of small libraries
None
Rendering to …
WebGL
vimeo.com/105880197 javazone webgl
React Native
None
None
APPS the
None
None
offline first
Full-featured online apps
None
None
Desktop and mobile apps
None
chrome os, windows 8, firefox os JavaScript as a first-class
citizen
We will see more of the backend developers on the
frontend … and that's a great thing!
VM the
Browser = rendering engine + JavaScript engine
Chakra SpiderMonkey JavaScriptCore V8 Nashorn
Super-competitive market Push for new features and better performance
2/3 of native speed on benchmarks emscripten + asm.js
None
Want to learn JS?
None
None
Takk for meg!