Upgrade to Pro — share decks privately, control downloads, hide ads and more …

JavaScript: The Past, Present and Future

6c51c14716e24bc1f1a3fb5ad234e773?s=47 Kim Joar Bekkelund
April 17, 2015
Programming
0
19

JavaScript: The Past, Present and Future

An introduction to the role of JavaScript. Given to students at NTNU in Trondheim, Norway.

6c51c14716e24bc1f1a3fb5ad234e773?s=128

Kim Joar Bekkelund

April 17, 2015
Tweet

More Decks by Kim Joar Bekkelund

See All by Kim Joar Bekkelund
ASTs in JavaScript
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
0
34
Writing Beautiful JavaScript Tests
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
12
2.1k
WebSockets and Server-Sent Events
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
1
160
Patterns of Large-Scale JavaScript Applications
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
20
1.3k
Patterns of Large-Scale JavaScript Applications
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
22
2.1k
Enkle JavaScript-abstraksjoner
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
1
140
Simple JavaScript Abstractions
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
9
740
Introduksjon til forretningsmodeller
6c51c14716e24bc1f1a3fb5ad234e773?s=48 kimjoar
2
230

Other Decks in Programming

See All in Programming
Vite でお手軽 Vue.js の環境構築
Be33a704f251c77162896ac5ba03e9ac?s=48 azuki
2
170
RFC 9111: HTTP Caching
1ff811939fd0923df8321ec6d8bf9d4b?s=48 jxck
0
150
Beyond Micro Frontends: Frontend Moduliths for the Enterprise @wad2022
15934fa2aa7b2ce21f091e9b7cffa856?s=48 manfredsteyer
PRO
0
120
Amazon Aurora の v1 が EOL になるので 10 クラスタアップグレードして出てきたノウハウ
A762939f94c8790c8ca8b717f1be9bee?s=48 dekokun
0
840
Meet Swift Regex
0b26590a0a8b0f1da140ed5de9b68379?s=48 usamik26
0
240
Android スキルセットをフル活用して始めるスマートテレビアプリ開発
2c4cb677e0a076b96f8edfba71b46aeb?s=48 satsukies
0
190
即、New Relic / New Relic NOW!
271fad8d53cd1f12f2b4b6d38e3d7bd3?s=48 uzulla
0
270
GitHub Actions を導入した経緯
41c9dedd1b4c53ace82e040bb09334fe?s=48 tamago3keran
1
420
Custom Design Systems in Compose UI
E86c7de302b490b7f2a67e54960510d0?s=48 rharter
5
510
[DC SF 2022] Hitchhiking through Jetpack Compose
2fff9b69a69973e14026624f8c8a9672?s=48 jossiwolf
2
150
エンジニアによる事業指標計測のススメ
Ee398a67f5017cc2ad5c02d67d10e516?s=48 doyaaaaaken
1
170
Dagger + Anvil: Learning to Love Dependency Injection
7cfefc4ecbffbe84b59de233d3fa4645?s=48 vrallev
3
230

Featured

See All Featured
Dealing with People You Can't Stand - Big Design 2015
44b54d2ffcb7857004071cc6795dde11?s=48 cassininazir
351
21k
How New CSS Is Changing Everything About Graphic Design on the Web
D83926c323d4f9289f947b4b4e76b939?s=48 jensimmons
213
11k
Imperfection Machines: The Place of Print at Facebook
7c8469ee8c9e594c65c59b919626c08d?s=48 scottboms
253
12k
Build The Right Thing And Hit Your Dates
016edace78ffe826f2348d1e0c504afd?s=48 maggiecrowley
19
1.2k
What's in a price? How to price your products and services
Dad095ea7038f89f760419ce475d5d14?s=48 michaelherold
229
9.4k
Put a Button on it: Removing Barriers to Going Fast.
Bfd6b681ec6e8c9bef82ff0521c364f7?s=48 kastner
56
2.3k
Visualization
170b760e0147792d0140e59ec78e9893?s=48 eitanlees
124
11k
Web Components: a chance to create the future
E190023b66e2b8aa73a842b106920c93?s=48 zenorocha
303
40k
The Mythical Team-Month
E6c6e133e74c3b83f04d2861deaa1c20?s=48 searls
209
39k
Building Applications with DynamoDB
39488f9d172ab92fd352f2cd7b73258d?s=48 mza
83
4.7k
Done Done
282d599b414022eba5096510f675b6e2?s=48 chrislema
174
14k
BBQ
761be20b5ebd271008bcee1244fc5b52?s=48 matthewcrist
74
7.9k

Transcript

  1. JavaScript The Past, Present and Future

  2. Kim Joar Bekkelund @kimjoar kim.bekkelund@bekk.no Fagleder i JS-plattform Jobbet i

    BEKK siden 2011
  3. None
  4. None

  5. It all started at 1995

  6. Brendan Eich + 10 days = JavaScript

  7. What did we do with this new language? (You really

    don't want to know)

  8. CUT & PASTE

  9. None
  10. None
  11. None

  12. … and this went on for almost 10 years

  13. 2004

  14. 2005

  15. What happened?

  16. What happened?

  17. What happened?

  18. What happened?

  19. JavaScript went from nothing to …

  20. "any application that can be written in JavaScript, will eventually

    be written in JavaScript." Atwood's Law

  21. JavaScript Where are we now?

  22. We expect more!

  23. None
  24. None

  25. SPA Single-page applications

  26. None

  27. 10/90? 50/50? 70/30?

  28. None
  29. None

  30. WebSockets Client Server Set up connection

  31. JavaScript + I/O Single-threaded, non-blocking

  32. None

  33. Node.js in production?

  34. “Assembly language of the web”

  35. None

  36. # 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

  37. 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.

  38. 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

  39. (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

  40. asm.js Speeding up compiled languages

  41. asm.js Speeding up compiled languages "an extraordinarily optimizable, low-level subset

    of JavaScript"

  42. C/C++ -> LLVM -> Emscripten -> asm.js

  43. int f(int i) { return i + 1; } C

    function f(i) { i = i|0; return (i + 1)|0; } asm.js

  44. But what happens when you can run C and C++

    code in the browser?
  45. None
  46. None
  47. None

  48. millions of lines of C compiled to asm.js/JavaScript running in

    a browser !

  49. JavaScript The future

  50. language, apps, ecosystem, VM

  51. LANGUAGE the

  52. ES1 1997 ES2 1998 ES3 1999 ES4 Abandoned ES5 2009

    ES6 2015 ES7 est. 2016

  53. Adjustments based on real-world problems

  54. None

  55. <!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
  56. None

  57. ECOSYSTEM the

  58. None

  59. Cryptography API, Audio API, WebRTC, File API …

  60. 60fps, but only one thread Web Workers 60fps, but only

    one thread
  61. None

  62. from mostly huge frameworks to thousands of small libraries

  63. None

  64. Rendering to …

  65. WebGL

  66. vimeo.com/105880197 javazone webgl

  67. React Native

  68. None
  69. None

  70. APPS the

  71. None
  72. None

  73. offline first

  74. Full-featured online apps

  75. None
  76. None

  77. Desktop and mobile apps

  78. None

  79. chrome os, windows 8, firefox os JavaScript as a first-class

    citizen

  80. We will see more of the backend developers on the

    frontend … and that's a great thing!

  81. VM the

  82. Browser = rendering engine + JavaScript engine

  83. Chakra SpiderMonkey JavaScriptCore V8 Nashorn

  84. Super-competitive market Push for new features and better performance

  85. 2/3 of native speed on benchmarks emscripten + asm.js

  86. None

  87. Want to learn JS?

  88. None
  89. None

  90. Takk for meg!