Angular8で追加された新機能Differential Loading(差分ロード)

去年の末あたりにAngular7がリリースされたと思ったのですが、もうすでにAngular8がリリースされました。大体半年スパンでメジャーバージョンが上がっていますね。Javaみたいですね。

Angular7から8にアップデートするには

ng update @angular/cli @angular/core

で一発です。

ivyとbazelについては来週までちょっと待って～みたいなことが書いてます。オレオレ翻訳ですが、、。

Differential Loading(差分ロード)

Angular8ではDifferential Loadingという機能が目玉のようです。直訳すると差分ロードでしょうか。

重くて仕方がないAngularがこの機能によって早くなるようです。検証とかは嫌いなので行いません。

と同時にes5とes2015のどちらにも対応するようでモダンブラウザじゃなくても良きに計らってAngularが動作してくれるそうです！これはすごい。

ちなみにそこだけ試しました。

	C:\angular8>ng build –prod

	Date: 2019-06-07T11:23:49.761Z
	Hash: 9205185b9243ad5eb4b8
	Time: 25549ms
	chunk {0} runtime-es5.741402d1d47331ce975c.js (runtime) 1.41 kB [entry] [rendered]
	chunk {1} main-es5.2451e185f7acf39cfb48.js (main) 242 kB [initial] [rendered]
	chunk {2} polyfills-es5.405730e5ac8f727bd7d7.js (polyfills) 111 kB [initial] [rendered]
	chunk {3} styles.3ff695c00d717f2d2a11.css (styles) 0 bytes [initial] [rendered]

	Date: 2019-06-07T11:24:09.075Z
	Hash: 6038d0f7f86375be284b
	Time: 19277ms
	chunk {0} runtime-es2015.858f8dd898b75fe86926.js (runtime) 1.41 kB [entry] [rendered]
	chunk {1} main-es2015.987c2ef9abe23bba4125.js (main) 209 kB [initial] [rendered]
	chunk {2} polyfills-es2015.edf60e92366a5a261979.js (polyfills) 36.8 kB [initial] [rendered]
	chunk {3} styles.3ff695c00d717f2d2a11.css (styles) 0 bytes [initial] [rendered]

view raw

Differential Loading

hosted with ❤ by GitHub

6行目と15行目にmain-es5とmain-es2015が作成されていることが確認できます。

ちなみに以下非推奨になった機能です。

この非推奨はAngular9でも10でも非推奨だと公式サイトで言っています。

さらにbrowserslistはデフォルトでIEはサポートしていないです。

IE対応したい場合はnotを削除しましょう。

	# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
	# For additional information regarding the format and rule options, please see:
	# https://github.com/browserslist/browserslist#queries

	# You can see what browsers were selected by your queries by running:
	# npx browserslist

	> 0.5%
	last 2 versions
	Firefox ESR
	not dead
	not IE 9-11 # For IE 9-11 support, remove 'not'.