honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs(browser-support): document browser support and polyfills (#2244)

This commit is contained in:
Marc Laval 2016-09-09 19:02:02 +02:00 committed by Igor Minar
parent 2c9e78c500
commit d4a641e553
4 changed files with 198 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/docs/dart/latest/guide/browser-support.jade Normal file
View File

@ -0,0 +1 @@
!= partial("../../../_includes/_ts-temp")

1
public/docs/js/latest/guide/browser-support.jade Normal file
View File

@ -0,0 +1 @@
!= partial("../../../_includes/_ts-temp")

5
public/docs/ts/latest/guide/_data.json
View File

@ -86,6 +86,11 @@
"intro": "Attribute directives attach behavior to elements."
},
"browser-support": {
"title": "Browser support",
"intro": "Browser support and polyfills guide."
},
"component-styles": {
"title": "Component Styles",
"intro": "Learn how to apply CSS styles to components."

191
public/docs/ts/latest/guide/browser-support.jade Normal file
View File

@ -0,0 +1,191 @@
:marked
# Browser support #
Angular supports most recent browsers. This includes the following specific versions:
table
tr
th Chrome
th Firefox
th Edge
th IE
th Safari
th iOS
th Android
th IE mobile
tr
td latest
td latest
td 14
td 11
td 9
td 9
td Marshmallow (6.0)
td 11
tr
td
td
td 13
td 10
td 8
td 8
td Lollipop<br>(5.0, 5.1)
td
tr
td
td
td
td 9
td 7
td 7
td KitKat<br>(4.4)
td
tr
td
td
td
td
td
td
td Jelly Bean<br>(4.1, 4.2, 4.3)
td
:marked
To ensure this compatibility, the unit tests of the framework are run on all of them for every pull request.
This is done as part of the continuous integration setup of the project, using [SauceLabs](https://saucelabs.com/) and [Browserstack](https://www.browserstack.com).
# Polyfills #
Angular is built on the latest standards of the web platform.
Targeting such a wide range of browsers can be challenging as they may not support all the features of modern browsers.
To fill the gaps, the best solution is to use polyfills which "upgrade" old browsers by adding missing features.
For each browser, some polyfill may be required to run any application, and some may be needed only when some features are used.
.alert.is-helpful
span As a developer, depending on the browsers you target and on the features you use, you'll need to load a set of polyfills.
span The tables below will help you making the right choices.
.alert.is-important
span The polyfills documented here are the ones which were identified to run full Angular application.
span Others may be needed if you decide to use extra features which are not supported everywhere.
span On top of that, they will not magically transform an old and slow browser into a modern and fast one.
:marked
## Mandatory polyfills ##
For each supported browser, these are the polyfills which are required to run an application:
table
tr
th Browsers (desktop & mobile)
th Polyfills required
tr
td Chrome, Firefox, Edge, Safari 9+
td None
tr
td Safari 7 & 8, IE10 & 11, Android 4.1+
td ES6
tr
td IE9
td ES6<br>classList
:marked
## Optional browser features to polyfill ##
In addition to the mandatory polyfills, some features of Angular may require some extra polyfills.
For example, the animations use the standard web animation API, which is only available in Chrome and Firefox today.
In order to use this feature in other browsers, the correct polyfill is needed.
Here are the features which may require additional polyfills:
table
tr
th Feature
th Polyfill
th Browsers (desktop & mobile)
tr
td
a(href="./animations.html") Animations
td Web Animations
td All but Chrome and Firefox<br>Not supported in IE9
tr
td
a(href="../api/common/index/DatePipe-class.html") Date
span ,
a(href="../api/common/index/CurrencyPipe-class.html") currency
span ,
a(href="../api/common/index/DecimalPipe-class.html") decimal
span and
a(href="../api/common/index/PercentPipe-class.html") percent
span pipes
td Intl API
td All but Chrome, Firefox, Edge and IE11
tr
td
a(href="../api/common/index/NgClass-directive.html") NgClass
span on SVG elements
td classList
td IE10, IE11
tr
td
a(href="./server-communication.html") Http
span when sending and receiving binary data
td Typed Arrays<br>Blob<br>FormData
td IE 9
:marked
## Suggested polyfills ##
Below are the polyfills which are used to test the framework itself. They are a good starting point for an application.
table
tr
th Polyfill
th Library
th Licence
th Size*
tr
td ES6
td
a(href="https://github.com/zloirock/core-js") https://github.com/zloirock/core-js
td MIT
td 27.4KB
tr
td classList
td
a(href="https://github.com/eligrey/classList.js") https://github.com/eligrey/classList.js
td Public domain
td 1KB
tr
td Intl
td
a(href="https://github.com/andyearnshaw/Intl.js ") https://github.com/andyearnshaw/Intl.js
td MIT / Unicode licence
td 13.5KB
tr
td Web Animations
td
a(href="https://github.com/web-animations/web-animations-js") https://github.com/web-animations/web-animations-js
td Apache
td 14.8KB
tr
td Typed Arrays
td
a(href="https://github.com/inexorabletash/polyfill/blob/master/typedarray.js") https://github.com/inexorabletash/polyfill/blob/master/typedarray.js
td MIT
td 4KB
tr
td Blob
td
a(href="https://github.com/eligrey/Blob.js") https://github.com/eligrey/Blob.js
td MIT
td 1.3KB
tr
td FormData
td
a(href="https://github.com/francois2metz/html5-formdata") https://github.com/francois2metz/html5-formdata
td MIT
td 0.4KB
:marked
*Figures are for minified and gzipped code, computed with [http://closure-compiler.appspot.com/home](http://closure-compiler.appspot.com/home)