I Choo-Choo Choose The Web: A History of the Web and JavaScript 1945-2012
I gave this as a keynote at the first ScotlandJS. Skip 22 slides in to begin the history walkthrough from 1945, the first group of slides are intro and only work with the talk.
Things to avoid in a keynote Meta-talk about the keynote itself Antagonizing the audience Anything “sexy” Hitler / contentious world history Racing through too many slides & topics Running over time ?
October 1991 First document showing off all HTML tags at the time (18!) http://www.w3.org/History/19921103-hypertext/hypertext/WWW/MarkUp/Tags.html Including oddities like and
"Distributed hypermedia method for automatically invoking external application providing interaction and display of embedded objects within a hypermedia document"
Language requirements Must let developers interact with Java Must be simple (Visual Basic-like) Can it look like Java, please? Oh, and get it done quick.
What we got Object oriented scripting language Prototypal inheritance (a la Self) Java/C family-esque syntax Dynamic, and loosely typed First class functions (hello Scheme!)
NETSCAPE AND SUN ANNOUNCE JAVASCRIPT, THE OPEN, CROSS-PLATFORM OBJECT SCRIPTING LANGUAGE FOR ENTERPRISE NETWORKS AND THE INTERNET 28 INDUSTRY-LEADING COMPANIES TO ENDORSE JAVASCRIPT AS A COMPLEMENT TO JAVA FOR EASY ONLINE APPLICATION DEVELOPMENT
"Netscape Enterprise Server is the first Web server to support the Java and JavaScript programming languages, enabling the creation, delivery and management of live online applications." from just $995!
Internet Explorer 3 DOM document.formName.inputName document.forms[0].elements[0] Client-side form validation “Rollover” effects.. “DOM Level 0” or “Legacy DOM”
Simple Validation <br/><!--<br/>Sub Submit_OnClick<br/>If IsNumeric(Document.myForm.Foo1.Value) Then<br/>If Document.myForm.Foo1.Value < 100 Or Document.myForm.Foo1.Value > 1000<br/>MsgBox "Please enter a number between 100 and 1000."<br/>Else<br/>MsgBox "Your Number Has Been Accepted!"<br/>End If<br/>Else<br/>MsgBox "Please enter a number."<br/>End If<br/>End Sub<br/>--><br/>
Initially very much like JS ActionScript 2 and 3 (2003 & 2006) added: compile time type checking type annotations class based OO syntax packages and namespaces ability to access DirectX and OpenGL
Reliable and extensible cross browser abstraction of many client-side JavaScript operations, including DOM element selection and manipulation, animations, event handling, and Ajax support.
JavaScript 1.7 comes to Firefox 2 October 2006 included many ideas now appearing in ES6 (e.g. let, generators, array comprehensions) .. but very much a Mozilla only dealie.
Improved markup, , , inline SVG, new form controls, custom data attributes.. plus a collection of APIs.. Canvas, Offline Web Applications, History manipulation, Drag and Drop, Microdata, WebStorage, and more..
Be aware many “not-officially-HTML5” specs are wrapped up in the HTML5 “brand” now: Server Sent Events, WebSocket, WebGL, Web Audio API, Geolocation API, etc.
"When Java applets failed, JavaScript became the 'language of the Web' by default. JavaScript's popularity is almost completely independent of its qualities as a programming language." Douglas Crockford
"In JavaScript, there is a beautiful, elegant, highly expressive language that is buried under a steaming pile of good intentions and blunders." Douglas Crockford
JavaScript: The Bad Parts Global variables, scope (function not block), automatic semicolon insertion (ASI), reserved words, Unicode support, typeof, parseInt, +, floating point, NaN, arrays..
“use strict”; Can’t create global variables. Can’t delete non-existing properties. Function argument names must be unique. No octal syntax for numbers. No “with” eval of strict mode code doesn’t introduce vars into outer scope And more, naturally..!
A nicer way to write JavaScript? December 2009 Adds syntactic sugar inspired by Ruby, Python and Haskell: list comprehension, pattern matching (in terms of destructuring assignments), significant whitespace, everything is an expression, class sugar, existential operator, variadic parameters, default parameters, heredocs, automatic lexical scoping, optional parentheses! (And more..)
The JS performance race is in full flow! Firefox 4’s JavaScript engine 4x faster than 3.6’s due to JaegerMonkey. November 2010 JIT becomes the name of the game.
April 2011 Internet Explorer 10 Platform Preview Still no WebGL Much better CSS3 and HTML5 support Hardware accelerated Canvas Big JS performance improvements
Class based, single inheritance, object oriented, C-like syntax.. a bit more Java- like in some ways. Optional typing, compiles to JS as CoffeeScript does (for now) but Chromium has a special Dart VM build.
Goals Be a better language for complex apps (and library shared by those apps) Good target for code generators Accept de facto standards where possible (vs inventing stuff)
New goodies let, const, function in block scope destructuring assignments ( let {a, b} = pt; } parameter default values ( function f(x, y = 10) { } ) rest, variadic parameters .. ( function(i, ...a) { } ) proxies, weak maps iterators, generators comprehensions ( return [a + b for (a in A) for (b in B)] ) arrow function syntax and more, naturally..
peterc
nabedge
cyberagentdevelopers
soracom
kohbis
tarappo
weblyzard
nnstt1
skrb
techtekt
oracle4engineer
miyake
yuya4
bkeepers
lara
moore
hatefulcrawdad
paigeccino
frogandcode
jlugia
stephaniewalter
matthewcrist
schacon
yeseniaperezcruz
deanohume