Your SlideShare is downloading. ×
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Fast Slim Correct: The History and Evolution of JavaScript.
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Fast Slim Correct: The History and Evolution of JavaScript.

2,163

Published on

A look back at how JavaScript has evolved over the past 18 years - how it broke out of the browser and can now be found in the most unexpected places. Presented at Worthing Digital, 7th Nov 2013.

A look back at how JavaScript has evolved over the past 18 years - how it broke out of the browser and can now be found in the most unexpected places. Presented at Worthing Digital, 7th Nov 2013.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,163
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
26
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • A modern web page without JS or CSS.
  • JavaScript glues technologies together.
  • JavaScript is built into every browser.
  • JavaScript is the most popular programming language in the world
  • The browser wars
  • ex Silicon Graphics (7 years) Joined Netscape in April 1995
    prototyped language (Mocha > LiveScript > JS) and SpiderMonkey compiler in 10 days in May 1995.
  • ex Silicon Graphics (7 years) Joined Netscape in April 1995
    prototyped language (Mocha > LiveScript > JS) and SpiderMonkey compiler in 10 days in May 1995.
  • 2000: XHR arrived In IE5 to support Outlook Web access
  • A very efficient data format
  • - JS is web native, other langs can become js, js can emulate other langs
    - JS engine runs in the browser and out of it.
  • Transcript

    • 1. / John Dalziel / @crashposition / Worthing Digital / 7th November 02013 FAST SLIM CORRECT / The Story Of How THE “GLUE OF THE INTERNET” BECAME THE WORLD’S MOST POPULAR PROGRAMMING LANGUAGE image: http://imgur.com/7pOwI
    • 2. / FAST SLIM CORRECT [SPOILER] JAVASCRIPT is the Glue Of The Internet
    • 3. / FAST SLIM CORRECT http://creativejs.com/2013/06/the-race-for-speed-part-1-the-javascript-engine-family-tree/ http://creativejs.com/2013/06/the-race-for-speed-part-2-how-javascript-compilers-work/ http://creativejs.com/2013/06/the-race-for-speed-part-3-javascript-compiler-strategies/ http://creativejs.com/2013/06/the-race-for-speed-part-4-the-future-for-javascript/ THE RACE FOR SPEED
    • 4. / FAST SLIM CORRECT What is JavaScript? some History bits some Science bits some Examples
    • 5. / FAST SLIM CORRECT JAVASCRIPT RECIPES A WEB BROWSER A JAVASCRIPT ENGINE JAVASCRIPT CODE HTML CODE RECIPE: + + + HTML
    • 6. / FAST SLIM CORRECT WHAT IS JAVASCRIPT? a native programming language for the web
    • 7. / FAST SLIM CORRECT ANATOMY OF A MODERN WEB PAGE CSS JavaScript
    • 8. / FAST SLIM CORRECT ANATOMY OF A MODERN WEB PAGE DEMO
    • 9. / FAST SLIM CORRECT JAVASCRIPT IS USEFUL KEYBOARD, MOUSE & TOUCH MONITOR & SPEAKERS WEB LANGUAGE WEB SERVERS & APIs
    • 10. / FAST SLIM CORRECT JAVASCRIPT IS EVERYWHERE • JavaScript is built into the BROWSER • on 6 million TABLETS, • on over 1 billion SMARTPHONES, • on over 2 billion COMPUTERS, • and in plenty of other places to...
    • 11. / FAST SLIM CORRECT JAVASCRIPT IS POPULAR http://redmonk.com/sogrady/2013/02/28/language-rankings-1-13/
    • 12. / FAST SLIM CORRECT “JavaScript is 18... now it’s not my responsibility; it can go out, vote, join the Navy, get drunk and gamble in most states.” BRENDAN EICH MOZILLA, 2013
    • 13. / FAST SLIM CORRECT HELLO WORLD the History Bit: Part 1
    • 14. / FAST SLIM CORRECT 1995
    • 15. 1995 / FAST SLIM CORRECT THE WEB in 1995
    • 16. 1995 / FAST SLIM CORRECT THE WEB in 1995
    • 17. 1995 / FAST SLIM CORRECT THE WEB in 1995
    • 18. 1995 / FAST SLIM CORRECT THE WEB in 1995
    • 19. 1995 / FAST SLIM CORRECT ANATOMY of a WEB PAGE HTML
    • 20. 1995 / FAST SLIM CORRECT INTERNET EXPLORER vs NETSCAPE
    • 21. 1995 / FAST SLIM CORRECT NETSCAPE’S VISION FOR JAVASCRIPT “We aimed to provide a “glue language” for the Web designers and part time programmers who were building Web content from components such as images, plugins, and Java applets.” “We saw Java as the “component language” used by higher-priced programmers.”
    • 22. 1995 / FAST SLIM CORRECT BRENDAN EICH DESIGNS JMOCHARIPT AIVASC RIP L VE T ...IN 10 DAYS Joins NETSCAPE in April 1995.
    • 23. 1995 / FAST SLIM CORRECT “IT COULD HAVE BEEN WORSE” SCHEME SELF JAVA } closures prototypes first class functions array = [] obj = {} eval() global objects with(){}
    • 24. / FAST SLIM CORRECT BECOMING USEFUL the History Bit: Part 2
    • 25. / FAST SLIM CORRECT “It may be slow. But it’s hard to use.” ANDREW S TANENBAUM regarding the IBM PC http://www.gdargaud.net/Humor/QuotesHardwareSoftware.html
    • 26. 1995 - 2000 / FAST SLIM CORRECT DHTML DYNAMIC HTML FORM VALIDATION + + + HTML TICKERS & POP UPS DEMO RECIPE: ROLLOVERS DEMO
    • 27. 2000 / FAST SLIM CORRECT XHR XMLHttpRequest 2000 2004 2005 OUTLOOK WEB GOOGLE MAIL GOOGLE MAPS RECIPE: + + + HTML + XHR
    • 28. 2005 / FAST SLIM CORRECT AJAX ASYNCHRONOUS JAVASCRIPT and XML JESSE JAMES GARRETT RECIPE: + + + HTML + XHR + XML
    • 29. / FAST SLIM CORRECT THINGS inside THINGS the Science Bit: Part 1 The difference between: a Web Browser a JavaScript Engine a JavaScript Compiler
    • 30. / FAST SLIM CORRECT a WEB BROWSER WEB BROWSER
    • 31. / FAST SLIM CORRECT inside a WEB BROWSER USER INTERFACE DATA BROWSER ENGINE RENDERING ENGINE NETWORKING JS ENGINE DISPLAY WEB BROWSER
    • 32. / FAST SLIM CORRECT inside a WEB BROWSER USER INTERFACE DATA BROWSER ENGINE RENDERING ENGINE NETWORKING JS ENGINE DISPLAY WEB BROWSER
    • 33. / FAST SLIM CORRECT a JAVASCRIPT ENGINE JAVASCRIPT ENGINE WEB BROWSER
    • 34. / FAST SLIM CORRECT inside a JAVASCRIPT ENGINE LEXER TOKENS PARSER AST NATIVE CODE INTERPRET TRANSLAT ER BYTE CODE OR JAVASCRIPT ENGINE WEB BROWSER
    • 35. / FAST SLIM CORRECT a JAVASCRIPT COMPILER COMPILER TOKENS COMPILER AST NATIVE CODE COMPILER BYTE CODE COMPILER JAVASCRIPT ENGINE WEB BROWSER
    • 36. / FAST SLIM CORRECT BROWSER / ENGINE / COMPILER COMPILER COMPILER COMPILER COMPILER JAVASCRIPT ENGINE WEB BROWSER
    • 37. / FAST SLIM CORRECT FAST, SLIM, CORRECT the History Bit: Part 3
    • 38. / FAST SLIM CORRECT FAST, SLIM, CORRECT Fast can accomplish more work in Faster code less time. Faster code can tackle more complex tasks. Slim Slim code downloads faster. Some slim code can compile faster. Correct Correct code will do what you expected.
    • 39. / FAST SLIM CORRECT “Fast, Slim, Correct. Pick any two, so long as one is correct.” BRENDAN EICH, MOZILLA regarding JavaScript compilers
    • 40. 1998 / FAST SLIM CORRECT JAVASCRIPT ENGINE FAMILY TREE JAVASCRIPT in 1998 Fast Slim Correct
    • 41. 1998+ / FAST SLIM CORRECT WEB STANDARDS JAVASCRIPT after 1998 Fast Slim Correct
    • 42. 2006+ / FAST SLIM CORRECT LIBRARIES and MINIFIERS JAVASCRIPT var dateRE = /^createdOnid/;var dates=[], els=document.getElementsByTagName('*'); for (var i=els.length;i--;) { if (dateRE.test(els[i].id]) { dates.push(els[i]) } }; JQUERY var dates = $('*[id^="createdOnid"]'); JAVASCRIPT in 2006 Fast Slim Correct
    • 43. 2006 / FAST SLIM CORRECT JAVASCRIPT ENGINE FAMILY TREE JAVASCRIPT in 2006 Fast Slim Correct
    • 44. / FAST SLIM CORRECT MAKING JS FAST the Science Bit: Part 2 How to make JavaScript Fast
    • 45. / FAST SLIM CORRECT inside a JAVASCRIPT ENGINE LEXER TOKENS PARSER AST NATIVE CODE INTERPRET TRANSLAT ER BYTE CODE OR JAVASCRIPT ENGINE WEB BROWSER
    • 46. / FAST SLIM CORRECT http://creativejs.com/2013/06/the-race-for-speed-part-1-the-javascript-engine-family-tree/ http://creativejs.com/2013/06/the-race-for-speed-part-2-how-javascript-compilers-work/ http://creativejs.com/2013/06/the-race-for-speed-part-3-javascript-compiler-strategies/ http://creativejs.com/2013/06/the-race-for-speed-part-4-the-future-for-javascript/ THE RACE FOR SPEED
    • 47. / FAST SLIM CORRECT FAST NATIVE CODE magic happens... JAVASCRIPT
    • 48. 2008+ / FAST SLIM CORRECT JAVASCRIPT ENGINE FAMILY TREE JAVASCRIPT after 2008 Fast Slim Correct
    • 49. / FAST SLIM CORRECT “any application that can be written in JavaScript, will eventually be written in JavaScript” JEFF ATWOOD STACKOVERFLOW, 2009
    • 50. / FAST SLIM CORRECT JAVASCRIPT APPLICATIONS Games and Applications
    • 51. / FAST SLIM CORRECT JAVASCRIPT APPLICATIONS GAMES RECIPE: + + + + WebGL
    • 52. / FAST SLIM CORRECT JAVASCRIPT APPLICATIONS INTERACTIVE DATA VISUALISATION RECIPE: + + +
    • 53. / FAST SLIM CORRECT JAVASCRIPT APPLICATIONS COMMUNICATION GOOGLE HANGOUTS RECIPE: + + + + WebRTC FACEBOOK CHAT
    • 54. / FAST SLIM CORRECT JAVASCRIPT AS EVERYTHING Compilers and Emulators
    • 55. / FAST SLIM CORRECT JAVASCRIPT as EMULATOR PC, LINUX, APPLE II, C64, NES, ZX SPECTRUM, ATARI ST, AMIGA... http://copy.sh/v24/ http://bellard.org/jslinux/ http://estyjs.azurewebsites.net/ http://jsspeccy.zxdemo.org/ http://archive.vg/blog/12-feature/114-a-big-list-of-browser-based-emulators-and-ports-of-classic-games RECIPE: + + +
    • 56. / FAST SLIM CORRECT JAVASCRIPT as COMPILER PASCAL, LUA, SMALLTALK, JAVASCRIPT http://www.teamten.com/lawrence/proje cts/turbo_pascal_compiler/demo/ https://github.com/mozilla/narcissus RECIPE: + + +
    • 57. 2013 / FAST SLIM CORRECT JAVASCRIPT as MONEY BITCOIN WALLET http://vimeo.com/77289033 RECIPE: + + + +
    • 58. / FAST SLIM CORRECT EVERYTHING AS JAVASCRIPT Cross-Compilers and LLVM
    • 59. / FAST SLIM CORRECT COMPILE to JAVASCRIPT COFFEESCRIPT, TYPESCRIPT, DART to JAVASCRIPT
    • 60. / FAST SLIM CORRECT COMPILE to JAVASCRIPT LLVM to JAVASCRIPT
    • 61. / FAST SLIM CORRECT COMPILE to JAVASCRIPT C to LLVM to JAVASCRIPT C CLANG
    • 62. / FAST SLIM CORRECT “JavaScript is assembly language for the web.” SCOTT HANSELMAN MICROSOFT, 2011
    • 63. / FAST SLIM CORRECT COMPILE to JAVASCRIPT UNREAL ENGINE 3 to JAVASCRIPT asm.js CLANG DEMO
    • 64. / FAST SLIM CORRECT JAVASCRIPT AS DATA JSON
    • 65. 2006 / FAST SLIM CORRECT JSON JAVASCRIPT OBJECT NOTATION XML JSON <Person> <name>Douglas Crockford</name> <discovers>JSON</discovers> <employer>Yahoo</employer> </Person> {“name”:”Douglas Crockford”, ”discovers”:”JSON”, employer:”Yahoo”} DOUGLAS CROCKFORD RECIPE: +
    • 66. 2006 / FAST SLIM CORRECT JSON NOSQL DATABASES RECIPE: +
    • 67. 2006 / FAST SLIM CORRECT JSON NEST THERMOSTAT http://www.wiredprairie.us/blog/index.php/archives/1754 RECIPE: +
    • 68. 2006 / FAST SLIM CORRECT JSON MERCEDES S CLASS http://www4.mercedes-benz.com/manual-cars/ba/foss/content/en/assets/FOSS_licences.pdf RECIPE: +
    • 69. 2009 JAVASCRIPT ON A SERVER NodeJS / FAST SLIM CORRECT
    • 70. 2009 / FAST SLIM CORRECT NODEJS JAVASCRIPT ENGINE ON THE SERVER JAVASCRIPT ENGINE
    • 71. 2009 / FAST SLIM CORRECT NODEJS DESKTOP AUTOMATION GRUNT RECIPE: + + PHOTOSHOP GENERATOR
    • 72. / FAST SLIM CORRECT JAVASCRIPT ON HARDWARE MicroPCs and MicroControllers
    • 73. / FAST SLIM CORRECT COMPUTER ON A BOARD RASPBERRY PI
    • 74. / FAST SLIM CORRECT COMPUTER ON A BOARD RASPBERRY PI AQUARIUM http://theoreticalideations.com/2013/09/03/its-alive-my-node-jsrasperry-pi-powered-aquarium-is-up-and-running/ RECIPE: + + + + Aquarium
    • 75. / FAST SLIM CORRECT MICROCONTROLLERS ARDUINO, BEAGLEBOARD, TESSEL, LEGO MINDSTORMS-NXT https://github.com/rwaldron/johnny-five RECIPE: + http://beagleboard.org/support/bonescript/ + http://tessel.io/ https://nodejsmodules.org/tags/lego
    • 76. / FAST SLIM CORRECT ROBOTS NODEJS WiFi-EXTENDING ROBOT http://glench.com/make/nodejs-robot/ RECIPE: + + + Arduino + Robot
    • 77. / FAST SLIM CORRECT ROBOTS PARROT AR DRONE 2.0 https://github.com/felixge/node-ar-drone RECIPE: + + + AR Drone
    • 78. / FAST SLIM CORRECT WHAT HAVE WE LEARNED? Please Make It Stop Now
    • 79. / FAST SLIM CORRECT C, JAVA LUA, PASCAL
    • 80. / FAST SLIM CORRECT THANK YOU For Your Time
    • 81. / John Dalziel / @crashposition / Worthing Digital / 7th November 02013 FAST SLIM CORRECT / The Story Of How THE “GLUE OF THE INTERNET” BECAME THE WORLD’S MOST POPULAR PROGRAMMING LANGUAGE image: http://imgur.com/7pOwI

    ×