JavaScriptの歴史を関連技術を時系列に整理して辿ってみた

はじめに
言語及び規格等
実行
エンジン
1. JavaScirptエンジン
2. HTMLレンダリングエンジン
開発環境
Webアプリケーションフレームワーク
おわりに
参考資料

はじめに

こんにちは！

なたでです。

今日は、Web開発等で出てくる単語を改めて調査してみてまとめてみました。もともと自作ホームページ作りとかしているときから、HTML、XHTML、CSSとか色々勉強してたのですが、最近はどんどん色々なものが出てきたので、ちょっと整理したくなりました。

今回まとめたものは私自身がよく知っているものもありますが、改めて調査して整理してみたいと思います。昔のものから最近のものまで、主にJavaScirpt開発系に関わりそうなもののをまとめてみたいと思います。誤っていたらごめんなさい。

一部よくわからないところは説明がしょぼいです。

言語及び規格等

HTML系／技術

World Wide Web Consortium (W3C)

1994年に設立されたWWWで利用される技術の標準化を推進する団体。

HTML 4.01

1997年にW3Cが勧告したハイパーテキストを記述するためのマークアップ言語。HTML 4.01を勧告以降、W3CはHTMLの改定に興味を示さなくなり、後のHTML5が出るまで10年以上かかった。

Web Hypertext Application Technology Working Group (WHATWG)

W3Cに不満をもったApple、Mozilla、Operaによって2004年に成立した団体。後のHTML5の元となった仕様を制定した。2017年にマイクロソフトも加入。

HTML5

HTMLの大改訂であり、HTML、DOM、ECMAScript、CSS等への機能拡張を行っている。W3CがWHATWGの結果を参考にまとめ2008年に草案を勧告し、2014年10月にHTML5を勧告。それ以降HTML5.1…と続いている。

JavaScript規格／関連技術

JavaScript

Netscapeにより開発されたプロトタイプベースの言語。初版は1995年にリリース。ECMAScriptという名前で1997年に標準化された。

JScript

マイクロソフトがNetscapeが開発したJavaScriptを意識して作り、IE3と同時にリリースした言語。1996年にリリース。WindowsのクライアントPCで動作するバッチ処理としても利用できる。歴史的な経緯から言語名、実行環境名、エンジン名が曖昧で分けられていない。基本的にはJScriptというと、WSHでバッチ処理が行えるJScriptを指すことが多い。

ダイナミックHTML

1997年ごろにブラウザ戦争で生まれた概念。JavaScriptとCSSを駆使して、サイトを書き換えること。当初はブラウザ間のDOMの差異や、技術不足な部分もあり、注目されていなかったが、今ではごく当たり前の概念である。

ECMAScript

JavaScript を標準化させて取り決められた言語。1996年ぐらいに登場し、初版のES1は1997年にリリースしている。HTML5を意識して設計されたES6以降、新しい仕様がどんどん追加されていっている。

Document Object Model (DOM)

HTMLの中身を解釈するための規格であり、言語ではない。JavaScriptの実行環境とDOMを操作できるようにしたものがHTMLレンダリングエンジンに含まれる。ブラウザ間ごとに操作が違うことを問題視して、W3Cにより制定された。この、DOM Level 1 は、1998年に勧告されている。CSS/CSS2を操作できる、DOM Level 2 は2000年に勧告される。

XMLHttpRequest

別のサーバー（URL)にあるデータをJavaScriptを用いて好きなタイミングでダウンロードできる。これによりAjaxという設計方法が生まれた。1999年のIE5から対応した技術。当初はActiveXオブジェクトとして実装。2001年には同様のオブジェクトがMozzila, Netscapeで実装、2004年にSafariでも実装された。

ES3

JavaScriptのECMAScript 3のこと。1999年12月にリリース。後述のJScriptはES3に対応している。try/catchの例外処理、正規表現などに対応した。なお、次のES4は、放棄されており存在しない。

Representational State Transfer (REST)

サービスを持つWebサーバーに対して、サービスを利用する手法のなかの1つの概念。2000年の論文の中で使われて、一般化していった。

SOAP

XMLでデータをやりとりするときの仕組み。2003年にSOAP Version 1.2がW3C 勧告されている。最近はJSONでやり取りする場合も多い。

Ajax

XMLHttpRequestがどのブラウザでも利用できるようになり、データを非同期で通信し、サイトを作り上げていくことができるようになることで生まれた概念。2005年に登場。

JavaScript Object Notation (JSON)

2006年にRFC 4627で仕様が規定された。ES3ベースで取り込みができるデータ記述形式。データの受け渡しに便利であるため、一般的に利用されるようになった。2009年には、JSON形式で格納できるDBのMongoDBがリリースされた。JSONの規格は、発表後も何度か仕様追加されている。追加された機能の中には、クロスドメインのデータを取得できるJSONPがある。

ES5

JavaScriptのECMAScript 5のこと。ES3から10年後の2009年12月にリリース。IE11では、最新のES6ではなくES5に対応しているため、変換が必要となる。このバージョンで、JSON、strictモードなどに対応した。

CommonJS

サーバーサイドでJavaScriptを動かすための規格を作るための2009年に立ち上げられたプロジェクト。ここで制定したモジュール（require/export）は、ES6で規格化（import/export）されたが、ES6の記載方法と互換性はない。Node.jsはこれ元にモジュールやプロミスなどを機能を実装している。

Promise

非同期処理を記述するAPI。CommonJS（Node.js）に実装された、後にES6にも実装される。対応していないブラウザで利用する場合は、es6-promiseを使うとよい。

altJS

最終的にJavaScirptに変換することを目的とした言語。もともとJavaScriptはプロトタイプベースの言語であり、他言語に慣れた人にとっては使いにくい仕様、大規模開発には向かない言語であった。それを補うために色々な言語ができた。有名なのは2010年に生まれたCoffeeScriptというものがある。

Asynchronous Module Definition (AMD)

JavaScriptのモジュール管理をする仕組みや定義。2011年あたりに登場した。ES6のモジュールとは書き方が異なる。Require.jsやDojo Toolkitが持つモジュール機能はこれを参考としている。

asm.js

JavaScirptであるが、特殊な書き方で記載することで、ブラウザが対応していれば高速に動作するasm.jsとして動作する。2013年に初版がリリース。現在は、後述のWebAsemblyへの変換が主流である。

ES6 (ECMAScript 2015 / ES2015)

JavaScriptのECMAScript 6のこと。2015年6月にリリース。モジュール機能やクラスの追加など大幅に機能アップしている。なお今後のリリースは制定した年がつくようになる。（例 ECMAScript 2016 など）CommonJSや、AMDとモジュールが乱立していたが、WebブラウザではES6のモジュール形式が標準になる。

WebAsembly (wasm)

ウェブブラウザで動作するアセンブリ言語のような言語。2017年にリリース。C言語などから色々な言語から、Emscripten等のツールを使用してコンパイルができる。

JavaScript開発支援言語（altJS）

CoffeeScript

バージョン1は2010年に登場。altJSの選択肢が少なかったため有名になる。リリース当時のES5では対応していなかったクラスなどが書ける。ES6の発表前にリリースされたものであり、変換ターゲットはES5になる。

Haxe

2005年に登場。もともとはActionScriptを置き換える目的で開発された。2012年に名前がhaXeからHaxeに変更した。JavaScript以外にもC、C++、C#、PHP、Pythonなど非常に多くの言語に変換できる。

TypeScirpt

マイクロソフトが開発した言語で、2012年にリリース。JavaScriptに書き方が近く、JavaScriptの書き方でも動作する。ES6をベースに静的型付けができることが特徴である。

JSX

DeNAによって開発された言語、2012年にリリース。Reactなどで利用できる。

CSS規格

CSS Level 1 (CSS1)

1996年に勧告されたCSS。margin、boder、paddingという基本的なボックスの概念が含まれる。

CSS Level 2 (CSS2), CSS Level 2.1 (CSS 2.1)

CSS2は1998年に勧告されているが、不明瞭な記載がありブラウザごとに認識が異なる問題があった。この不明瞭な部分を直すために、13年後の2011年にCSS2.1が勧告された。

CSS Level 3 (CSS3)

CSS2の認識の齟齬を補強したCSS2.1をベースに、機能を増やしたもの。機能の種類をモジュールと呼び、それぞれ勧告時期が異なる。2013年に勧告が始まり、年々、勧告するモジュールが増えている。

CSS Cascading and Inheritance Level 3

CSS3のcss-cascade-3モジュール。例えば、内部で変数計算及びアニメーションを行ったりできる。2016年5月に勧告。

CSS Backgrounds and Borders Module Level 3

CSS3のcss3-backgroundモジュール。例えば、丸みを帯びたボタンが作れる。2017年10月に勧告。

Selectors Level 3, Selectors Level 4

CSS3のselectors-3、selectors-4。セレクターを補強。それぞれ2018年1月、2018年2月に勧告。

CSS Fonts Module Level 3

CSS3のcss-fonts-3。例えば、Webフォントに対応。2018年6月に勧告。

CSS開発支援言語

Syntactically Awesome Stylesheets (SASS / Sass)

CSSを生成するためのスクリプト言語。2006年にリリース。変数や継承などが利用できるため複雑なCSSを作ることができる。変数などはSASS登場の10年後のCSS3で対応となっている。

Leaner CSS (LESS)

SASSに影響されて作成されたスクリプト言語。2009年にリリース。SASSは予めコンパイルしてCSSを作る必要があるが、LESSは、LESS.jsを通してリアルタイムコンパイルが可能である。

HTML以外の技術

Shockwave

Webブラウザ上でマルチプラットフォームで動作させることができる技術。MacroMindが1990年より前に開発し、Macromediaに買収後、1995年にShockwave Player 1.0というブランドでリリース。

ActiveX

マイクロソフトが開発した技術で、マイクロソフト製のブラウザで専用アプリを動作させることができる。1996年に登場。ここで、XMLHttpRequestというオブジェクトをマイクロソフトが実装したことで、Ajaxが広まっていった。

Webブラウザ上でマルチプラットフォームで動作させることができる技術。1996年にフューチャーウェーブが開発し、Macromediaが買収。ベクターイメージで描写することでファイルサイズを抑え、ネットワーク回線が遅い環境でも、すぐに表示ができることで人気が出た。2000年に発売したFlash 5からは、ECMAScriptベースのActionScriptを利用できるようになった。2018年には、HTML5への置き換えが進んでおり、2020年には終了予定である。

Javaアプレット

Javaアプリケーションを、Webブラウザで実行する技術。1996年にNetscape Navigatorに搭載されたことで普及した。Webブラウザで動作させるために、セキュリティを高める必要があり、ユーザーが許可を与えなければ機能に制限が与えられた。

Java Web Start

Javaアプレットを置き換えるものとして、2001年に登場。Javaアプレットは、ウィンドウ内の決められた枠内でしか表示できなかったが、Java Web Startは完全に別のアプリケーションが立ち上がるようなことが行えるようになった。2018年にオラクルが開発したJava11で廃止された。

Microsoft Silverlight

Flashに対抗する形で、2007年に登場。2011年にリリースした、Silverlight 5をもって開発終了の可能性があると報道されている。

実行

クライアント用実行環境

Microsoft JScript

Windows用のバッチ処理用実行環境である。1996年に初版が公開される。Windows Script Host (WSH)、ActiveXが利用できる。特殊な書き方をすることで高速なChakraエンジンを利用することが可能である。Chakraエンジンを利用させる場合、逆にWSHとしての制限事項が増える。

Microsoft Active Desktop

Windowsのデスクトップ画面で動作する実行環境である。1997年に登場。Windows 98で標準搭載され、2006年にリリースされたWindows Vistaで廃止された。

HTML Application (HTA)

Windows用のHTMLでクライアント向けアプリケーションを作る技術。1999年に登場。2003年に特許をとっている。

Apple Dashboard Widget

Macのウィジェットとして動作させる。2005年に登場したMac OS X v10.4以降から利用できる。

Windows Desktop Gadgets

Windowsのデスクトップ上にガジェットとしてWebアプリケーションを起動できる技術。2006年に登場したWindows Vistaでは、サイドバーという名称であったが、2009年のWindows 7からはガジェットという名称になる。2012年のWindows 8ではStart screenに置き換えられた。

Adobe AIR

アドビが開発したマルチプラットフォームで動作するWebアプリケーション。2008年に正式リリース。Webkitを内蔵しており、HTML、Ajaxで実装されたアプリケーションを動作できる。Flashを動作させることも可能。

AppJS

デスクトップアプリケーション開発向けのフレームワーク。2012年に登場。

node-webkit

Webアプリケーションを実行形式にするツール。2013年あたりに登場。2015年あたりにNW.jsに名前を改名。

Electron

Webアプリケーションを実行形式にするツール。2013年あたりに登場。内部にChromiumとNode.jsが入っており、マルチプラットフォームのアプリを作るのに向いている。

NW.js

Webアプリケーションを実行形式にするツール。2013年あたりから node-webkit という名前で開発し、2015年あたりに登場。

Proton Native

React Nativeを使って開発するWebアプリケーション開発ツール。2017年に登場。

モバイル端末用実行環境

Apache Cordova

モバイル端末のネイティブ機能も呼び出せるモバイルアプリケーション開発フレームワーク。2011年あたりに登場。これで作ったものはハイブリッドアプリと呼ばれる。

React Native

Reactを用いて開発を行うモバイルアプリケーション開発フレームワーク。2015年に登場。

サーバーサイド用実行環境

Node.js

サーバーサイド用の実行環境。npmもセットでインストールされる。2009年に初版が公開される。一時期、開発停滞を危惧した人たちが、io.jsにフォークして分裂したが今はnode.jsに合流している。内部で利用されるランタイムは基本的に Google V8 だが、ChakraCoreで動くのもある。

io.js

サーバーサイド用の実行環境。2014年の12月にnode.jsをフォークしたもの。2015年にnode.jsに統合している。

開発手法

SPA (Single Page Application)

JavaScirpt でクライアントでウェブサイトを構築する手法。クライアントとサーバー間で通信が行われるため、構築に時間がかかる場合がある。

SSR (Server Side Application)

サーバーで、Webサイトを作る手法。表示時にはページが確定しているためSEO的にはよいとされる。Perl、PHPなどが該当。

ハイブリッドアプリ

モバイル端末上でWebViewを表示させて、内部のJavaScriptからネイティブAPIを呼び出してアプリを作る開発手法。

エンジン

JavaScirptエンジン

JScript

WindowsのクライアントPCで動作するJScriptバッチの実行環境でもあり、Internet Explorer 8までに搭載されているエンジンでもある。1996年に初版が公開される。

SpiderMonkey

Mozilaが開発したJavaScriptエンジンであり、FireFoxに搭載されている。オープンソース（MPL 2.0）となっている。

KJS

WebKitで利用されているJavaScriptエンジン。これをベースとしたエンジンがWebKitで利用されている。

V8

Googleが開発したChromeに搭載されているJavaScriptエンジン。Java VMの元開発チームが開発しており、最初にコンパイルを行うため高速。オープンソース（修正BSDライセンス）となっている。

Chakra

マイクロソフトが作成した新しいJavaScriptエンジン。IE9以降、Edgeに搭載されている。一部、ChakraCoreという名前でオープンソース（MIT License）となっている。

Rhino

Javaで記述されたJavaScriptエンジンであり、JDKに搭載されている。オープンソース（MPL）となっている。

HTMLレンダリングエンジン

Trident

Internet Explorer (IE)で利用されるレンダリングエンジン。

Gecko

FireFoxで利用されるレンダリングエンジン。

WebKit

Safariで利用されるレンダリングエンジン。

EdgeHTML

Edgeで利用されるレンダリングエンジン。

Blink

2013年にWebKitをフォークしたChromeで利用されるレンダリングエンジン。

開発環境

ソースコード管理システム

Concurrent Versions System(CVS)

1990年に登場したソースコード管理システム。現在は全く使われていない。

Apache Subversion(SVN)

2000年に登場したソースコード管理システム。コミットの度に番号が増加するため、番号が大きいほど新しい修正であると見分けることができる。Gitは、ハッシュのようになっており、新しいかどうかは分からない。

Git

Linuxカーネルのソースコード管理のために生まれた管理システム。2005年に登場。ローカルでコミットし、最終的にサーバーにプッシュするというもの。Gitを無料で利用できる、2008年にGitHubが有名になり一般的になる。Web用のソフト開発ではよく利用されている。

メタパッケージ管理システム

npm

JavaScript用の管理システム。2010年に初版が公開。例えば、Linuxでいうと、yumとかAPTとかそういう感じのもの。

Yarn

Facebookが中心に開発したJavaScript用の管理システム。2016年10月に初版がリリース。npm (package.json)と互換がある。

Web開発向けエディタ

ホームページ・ビルダー

1996年にリリースされた有料のWeb開発向けエディタ。日本IBMが開発。1996年～2005年はこれで自分のホームページを作る人が多かった。作ったホームページはジオシティーズやInfoseekといった広告付き無料サーバーで公開していた。その後、ブログなどのCMS、SNSの登場で、ホームページを1から作る人は減っていった。

Dreamweaver

1997年にリリースされた有料のWeb開発向けエディタ。マクロメディアが開発。現在はAdobeが開発している。

Sublime Text

2008年にバージョン1がリリースされた有料のソースコードエディタ。

WebStorm

2010年にリリースされたJavaScript開発用の有料ソースコードエディタ。

Atom

GitHubが主体となって開発しているElectron製ソースコードエディタ。2015年にバージョン1が公開された。

Visual Studio Code (VSCode)

マイクロソフトが開発したElectron製ソースコードエディタ。2015年に公開。2018年はこれが主流になりつつある。

静的解析ツール／コードフォーマッター

Another HTML-lint gateway

k16さんがWeblintに触発されて作成したHTML4の静的解析ツール。1997年にリリースされた。HTML5は未対応。点数が出るので面白く、昔はこれで100点を目指していた。

JSLint

2007年あたり有名になったJavaScript用の静的解析ツール。オライリーの「JavaScript: The Good Parts」の著者が作成したツール。

JSHint

JSLintのルールが厳格すぎる問題を解決するためにフォークされて、変更を加えたJavaScript用の静的解析ツール。2011年に登場。

ESlint

ES6に対応したJavaScript用の静的解析ツール。2013年に登場。全てのルールでオンオフの切り替えができて、カスタマイズ性があり自由度が高い。

JSCS

2013年ごろに登場。ESLintにマージされている。

ビルドツール

Browserify

node.jsのモジュール機能を利用したjsをまとめて、モジュール未対応のブラウザでも動かすことができるようにするツール。2011年に登場。

webpack

複数のモジュールで構成されたjsやcssなどのファイルを、1つのファイルに固めることを目的としたツール。2012年に登場。

rollup.js

ES6機能で記載したモジュールjsをライブラリとして公開する場合に1つのファイルに固めるという目的のツール。2016年あたりに登場。

Parcel

Adobeのエンジニアが中心になって開発した複数のファイルを一緒にするツール。2017年あたりに登場。webpackのような複雑な設定が不要。

トランスコンパイラ

Babel

ES6で記載したスクリプトをES5に変換するコンパイラ。2014年から開発が始まったツールで、今でもIE対応をする場合や、ES5専用ツールに変換するために利用されている。

Buble

Webブラウザ向けのES6に変換するコンパイラ。2015年あたりに登場。Babelと違って複雑な設定ファイルは不要。

軽量化／難読化ツール

UglifyJS

ES5で記載したスクリプトをminifyするツール。2010年あたりに登場。minifyとは、不要な変数の除去や変数名を短くするなど、ソースコードを最適化しファイルサイズを小さくすること。

UglifyES

UglifyJSとは別ブランチで開発しているUglifyJSのES6対応版。2017年あたりに登場。

タスクランナー

Grunt

タスクランナー。LinuxでいうとMakeのようなもの。2011年あたりに登場。

gulp

2014年あたりに登場。gruntと違う点は、並列で実行できるというもの。GoogleがWeb Starter Kitにも取り入れた。

Broccoli

2013年ぐらいから開発が始まり、2016年にバージョン1がリリース。

テスト用ツール

QUnit

JavaScript用の単体テスト自動化用のフレームワーク。2008年に登場。

Sinon.js

JavaScript用のMock用のライブラリ。2010年に登場。

TravisCI

GitHub上のソフトウェアのビルドやテストを行うウェブサービス。2011年あたりに登場。

mocha

設定したテストプログラムを実行するテストランナー、テストフレームワーク。2011年に登場。

PhantomJS

WebKitを内蔵したGUIを持たないブラウザ。自動試験で利用される。2011年に登場し、2018年に開発終了。

Chai

JavaScriptでテストのアサーション用のAPIを提供。2012年あたりに登場。

Jasmin

テストランナー（mocha）とアサーション（chai）が利用できるテストツール。2012年あたりに登場。

istanbul

JavaScriptでテストのカバレッジを調べる。2013年に登場。

power-assert

JavaScriptでテストのアサーション用のAPIを提供。2013年に登場。

Headless Chromium

ウィンドウを持たないブラウザ。自動試験等で利用される。2014年あたりに登場。

Jest

Facebook製のテスト用パッケージ。mocha、chai、Sinon.js、istanbul といった色々な機能がこの1つのパッケージで利用できる。2014年あたりに登場。

ドキュメント作成ツール

JSDoc

Java用のJavadocに似た構文を書くことでドキュメントを自動生成できるツール。開発停止。1999年以前からある。

JsDoc Toolkit

JSDocのバージョン2系。2007年あたりに登場。動作にはJavaが必要。2011年あたりに開発停止し、JSDoc3が開発されている。

JSDoc3

JSDocのバージョン3系。2011年あたりに登場。2015年11月のJSDoc 3.4.0からES6に対応しているが、「export default」には正式対応していないため「jsdoc-export-default-interop」が必要。型定義ファイル( d.ts )に変換する支援ツール「tsd-jsdoc」と組み合わせるとよい。

ESDoc

ES6向けのドキュメント自動生成ツール。ドキュメントカバレッジなども計算できる。作成したドキュメントが綺麗。ベータ版だがドキュメントのホスティングサービスも存在。2015年に登場。

Documentation.js

ES6向けのドキュメント自動生成ツール。2015年に登場。

CSS開発向けツール

PostCSS

CSSに対してポストプロセッサ環境を提供するツール。2013年にリリース。プラグイン形式をとっており、色々な機能を追加できる。

Autoprefixer

自動でベンダープリフィックスを付けてくれるツール。2013年あたりに登場。

cssnext

制定中のCSSを、現在のCSSに変換するトランスコンパイラ。2014年あたりに登場。

stylelint

CSSのlinkツール。2015年あたりに登場。

cssnano

CSS版のminifyツール。2015年あたりに登場。

Webサーバー向けフレームワーク

Express.js

2010年に登場したフレームワーク。Node.jsを用いたWebサーバーを作るための機能がつまっている。

Meteor

node.jsを用いて、アプリケーションを作るためのフルスタックフレームワーク。DB処理なども含まれている。デスクトップアプリケーション向けにも利用可能。2012年に登場。

Webアプリケーションフレームワーク

DOM支援フレームワーク

Prototype JavaScript Framework (prototype.js)

Ajaxフレームワークや、色々な開発支援を含んだフレームワーク。2005年にリリース。jQueryが広まる前に利用されていた。

jQuery

ウェブブラウザ間のDOMを吸収したり、拡張するためのフレームワーク。2006年にリリース。機能の一部は、ES6やDOMに影響を及ぼした。導入すると重たくなるため、HTML5が一般的になった現在、ブラウザ間のDOMの差異もなくなってきており、使わない場合も多くなってきているが、jQueryに依存したライブラリが多数ある。