You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by ha...@apache.org on 2017/10/13 13:04:36 UTC
[41/51] [abbrv] incubator-weex-site git commit: update file structure
and fix responsive styles
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_draft/web-standards.en.md
----------------------------------------------------------------------
diff --git a/_draft/web-standards.en.md b/_draft/web-standards.en.md
deleted file mode 100644
index 906ff76..0000000
--- a/_draft/web-standards.en.md
+++ /dev/null
@@ -1,584 +0,0 @@
----
-title: Web standards
-type: references
-order: 8
-version: 2.1
-has_chapter_content: true
----
-
-# Web standards
-
-## HTML
-
-refs: https://www.advancedwebranking.com/html/ 2016-12-11
-
-### Overview
-
-| percentage | name | supported |
-| ---- | ---- | ---- |
-| 98.1% | `<head>` | - |
-| 97.9% | `<body>` | - |
-| 97.9% | `<html>` | - |
-| 97% | `<title>` | - |
-| 93.9% | `<meta>` | - |
-| 89.9% | `<div>` | ✓ |
-| 89.6% | `<a>` | ✓ |
-| 88.5% | `<script>` | ✓ |
-| 86.5% | `<link>` | - |
-| 86.3% | `<img>` | ✓ |
-| 81.5% | `<p>` | - (can be customized) |
-| 75.6% | `<span>` | - (can be customized) |
-| 73.8% | `<li>` | - (can be customized) |
-| 73.7% | `<ul>` | - (can be customized) |
-| 70.3% | `<br>` | ✕ |
-| 60.4% | `<style>` | ✓ |
-| 55.8% | `<h1>` | - (can be customized) |
-| 52.7% | `<h2>` | - (can be customized) |
-| 48.4% | `<input>` | ✓ |
-| 46.9% | `<form>` | ✕ |
-| 44.3% | `<strong>` | - (can be customized) |
-| 43.1% | `<h3>` | - (can be customized) |
-| 30.9% | `<table>` | ✕ |
-| 30.3% | `<tr>` | ✕ |
-| 30.2% | `<td>` | ✕ |
-
-### Forms
-
-| percentage | name | supported |
-| ---- | ---- | ---- |
-| 49.5% | `<option>` | ✕ |
-| 30.2% | `<input>` | ✓ |
-| 16.6% | > `[type="hidden"]` | - |
-| 8% | > `[type="text"]` | ✓ |
-| 4.2% | > `[type="submit"]` | - |
-| 2% | > `[type="checkbox"]` | - (`<switch>`) |
-| 1.2% | > `[type="email"]` | ✓ |
-| 1.1% | > `[type="radio"]` | ✕ |
-| 0.9% | > `[type="image"]` | - |
-| 0.8% | > `[type="button"]` | - |
-| 0.6% | > `[type="search"]` | ✕ |
-| 0.6% | > `[type="password"]` | ✓ |
-| 0.1% | > `[type="tel"]` | ✓ |
-| 0.1% | > `[type="number"]` | ✓ |
-| 0% | > `[type="reset"]` | - |
-| 0% | > `[type="file"]` | ✕ |
-| 0% | > `[type="date"]` | ✓ |
-| 0% | > `[type="url"]` | ✓ |
-| 0% | > `[type="range"]` | ✕ |
-| 0% | > `[type="color"]` | ✕ |
-| 0% | > `[type="time"]` | ✓ |
-| 0% | > `[type="datetime-local"]` | ✕ |
-| 7.2% | `<label>` | - |
-| 6.1% | `<form>` | - |
-| 3.7% | `<button>` | - (can be customized) |
-| 2.6% | > `[type="button"]` | - |
-| 1.3% | > `[type="submit"]` | - |
-| 0% | > `[type="reset"]` | - |
-| 1.9% | `<select>` | ✕ |
-| 0.7% | `<textarea>` | ✓ |
-| 0.5% | `<fieldset>` | - |
-| 0.1% | `<optgroup>` | ✕ |
-| 0.1% | `<legend>` | - |
-| 0% | `<progress>` | ✕ |
-| 0% | `<datalist>` | - |
-| 0% | `<output>` | - |
-| 0% | `<meter>` | - |
-
-## CSS Properties
-
-refs: https://www.chromestatus.com/metrics/feature/popularity 2016-12-11
-
-| percentage | name | supported |
-| ---- | ---- | ---- |
-| 90.5115% | display | ✕ `flex` only |
-| 89.8243% | margin | ✓ (not support combo) |
-| 88.7012% | width | ✓ |
-| 88.6468% | overflow | ✓ iOS only, `hidden` only for Android |
-| 88.6432% | background-color | ✓ |
-| 88.0803% | height | ✓ |
-| 87.7648% | font-size | ✓ |
-| 87.3837% | padding | ✓ |
-| 87.2721% | color | ✓ |
-| 86.9788% | text-align | ✓ |
-| 86.6841% | position | ✓ `relative` by default, `static` not supported |
-| 86.6039% | font-family | ✓ |
-| 86.5943% | font-weight | ✓ |
-| 85.0072% | opacity | ✓ |
-| 80.6911% | max-width | ✕ |
-| 79.4476% | box-sizing | ✕ `border-box` only |
-| 75.7623% | max-height | ✕ |
-| 74.9939% | webkit-user-select | ✕ |
-| 57.0292% | align-items | ✓ |
-| 56.8182% | justify-content | ✓ `space-around` not supported well in browser |
-| 50.5941% | flex-direction | ✓ |
-| 48.5052% | border | ✓ |
-| 47.5161% | top | ✓ |
-| 46.9136% | background | ✕ |
-| 46.1552% | cursor | ✕ |
-| 46.1443% | margin-left | ✓ |
-| 46.0956% | left | ✓ |
-| 46.0848% | text-decoration | ✓ |
-| 45.9575% | float | ✕ |
-| 45.8391% | border-bottom | ✓ |
-| 45.7639% | padding-left | ✓ |
-| 45.7128% | margin-top | ✓ |
-| 45.7013% | line-height | ✓ |
-| 45.5836% | background-image | ✕ |
-| 45.0837% | z-index | ✕ |
-| 45.0649% | right | ✓ |
-| 45.0516% | margin-bottom | ✓ |
-| 45.0459% | white-space | ✕ |
-| 44.8710% | margin-right | ✓ |
-| 44.8476% | vertical-align | ✕ |
-| 44.6306% | padding-top | ✓ |
-| 44.1466% | border-radius | ✓ |
-| 44.0136% | border-top | ✓ |
-| 43.9815% | padding-bottom | ✓ |
-| 43.9392% | padding-right | ✓ |
-| 43.8539% | visibility | ✕ |
-| 43.4306% | background-position | ✕ |
-| 43.4098% | background-repeat | ✕ |
-| 43.0391% | clear | ✕ |
-| 42.9100% | bottom | ✓ |
-| 42.2092% | content | ✕ |
-| 42.0690% | box-shadow | ✕ |
-| 41.9004% | border-color | ✓ |
-| 41.7341% | outline | ✕ |
-| 41.4297% | border-right | ✓ |
-| 41.2605% | border-left | ✓ |
-| 41.1127% | min-height | ✕ |
-| 41.0736% | font-style | ✓ |
-| 41.0523% | min-width | ✕ |
-| 40.4298% | list-style | ✕ |
-| 39.7341% | font | ✕ |
-| 38.8999% | background-size | ✕ |
-| 38.7811% | border-width | ✓ |
-| 38.7718% | border-collapse | ✕ |
-| 37.8110% | border-style | ✓ |
-| 37.4962% | text-overflow | ✓ must work with `lines` |
-| 37.3471% | text-transform | ✕ |
-| 37.2154% | transition | ✕ |
-| 36.5155% | overflow-y | ✕ |
-| 36.3025% | transform | ✕ |
-| 36.2488% | text-indent | ✕ |
-| 35.5075% | text-shadow | ✕ |
-| 34.7607% | webkit-appearance | ✕ |
-| 34.1925% | list-style-type | ✕ |
-| 34.0238% | border-spacing | ✕ |
-| 33.6664% | word-wrap | ✕ |
-| 31.9961% | overflow-x | ✕ |
-| 31.9922% | zoom | ✕ |
-| 31.2495% | border-bottom-left-radius | ✕ |
-| 31.1306% | pointer-events | ✕ |
-| 31.1229% | border-top-left-radius | ✕ |
-| 30.2131% | border-bottom-color | ✓ |
-| 29.9608% | border-top-color | ✓ |
-| 29.4297% | border-bottom-right-radius | ✕ |
-| 29.2668% | border-top-right-radius | ✕ |
-| 28.6489% | letter-spacing | ✕ |
-| 27.8327% | animation | ✕ |
-| 26.6738% | border-right-width | ✓ |
-| 26.0169% | src | ✕ |
-| 25.2661% | clip | ✕ |
-| 25.2512% | webkit-font-smoothing | ✕ |
-| 25.1971% | border-bottom-width | ✓ |
-| 25.0246% | border-right-color | ✓ |
-| 24.7790% | direction | ✕ |
-| 24.4094% | webkit-tap-highlight-color | ✕ |
-| 23.9751% | border-left-color | ✓ |
-| 23.9321% | border-top-width | ✓ |
-| 23.7902% | fill | ✕ |
-| 23.2617% | border-left-width | ✓ |
-| 22.7278% | table-layout | ✕ |
-| 21.5766% | word-break | ✕ |
-| 20.4319% | background-clip | ✕ |
-| 19.3198% | transform-origin | ✕ |
-| 18.9233% | filter | ✕ |
-| 17.7879% | resize | ✕ |
-| 16.2501% | flex | ✕ |
-| 15.1656% | font-variant | ✕ |
-| 14.9181% | text-rendering | ✕ |
-| 14.7125% | webkit-filter | ✕ |
-| 14.5263% | transition-duration | ✕ |
-| 14.3966% | transition-property | ✕ |
-| 14.2124% | webkit-box-orient | ✕ |
-| 13.5432% | outline-offset | ✕ |
-| 12.9300% | transition-timing-function | ✕ |
-| 12.2788% | unicode-range | ✕ |
-| 12.0880% | word-spacing | ✕ |
-| 11.9124% | quotes | ✕ |
-| 11.6800% | border-bottom-style | ✓ |
-| 11.4263% | webkit-background-clip | ✕ |
-| 11.0070% | flex-grow | ✕ |
-| 10.5925% | backface-visibility | ✕ |
-| 10.4417% | animation-name | ✕ |
-| 10.4302% | stroke | ✕ |
-| 10.4144% | animation-duration | ✕ |
-| 10.2804% | touch-action | ✕ |
-| 9.9663% | list-style-position | ✕ |
-| 9.8662% | order | ✕ |
-| 9.7770% | outline-width | ✕ |
-| 9.7504% | transition-delay | ✕ |
-| 9.4689% | border-top-style | ✓ |
-| 9.3474% | webkit-box-pack | ✕ |
-| 9.3078% | webkit-box-align | ✕ |
-| 9.2375% | page-break-inside | ✕ |
-| 9.1898% | webkit-line-clamp | ✕ |
-| 8.9350% | list-style-image | ✕ |
-| 8.8339% | page-break-after | ✕ |
-| 8.5735% | speak | ✕ |
-| 8.4754% | unicode-bidi | ✕ |
-| 8.4307% | animation-timing-function | ✕ |
-| 8.1464% | webkit-box-flex | ✕ |
-| 8.0048% | orphans | ✕ |
-| 7.9947% | widows | ✕ |
-| 7.6671% | flex-wrap | ✓ not supported well in browser |
-| 7.5756% | animation-fill-mode | ✕ |
-| 7.4163% | animation-delay | ✕ |
-| 7.3284% | border-left-style | ✓ |
-| 7.1586% | outline-color | ✕ |
-| 6.9102% | flex-shrink | ✕ |
-| 6.7754% | perspective | ✕ |
-| 6.7748% | border-right-style | ✓ |
-| 6.4619% | outline-style | ✕ |
-| 6.0382% | animation-iteration-count | ✕ |
-| 5.9838% | background-origin | ✕ |
-| 5.9714% | fill-opacity | ✕ |
-| 5.9357% | will-change | ✕ |
-| 5.3740% | stroke-width | ✕ |
-| 5.3172% | transform-style | ✕ |
-| 5.2608% | overflow-wrap | ✕ |
-| 5.1730% | background-attachment | ✕ |
-| 4.9039% | counter-increment | ✕ |
-| 4.5950% | counter-reset | ✕ |
-| 4.5031% | align-self | ✕ |
-| 4.4109% | webkit-box-ordinal-group | ✕ |
-| 4.4046% | webkit-animation-direction | ✕ |
-| 3.7598% | background-position-x | ✕ |
-| 3.6867% | border-image | ✕ |
-| 3.6601% | background-position-y | ✕ |
-| 3.5749% | webkit-user-drag | ✕ |
-| 3.3376% | flex-basis | ✕ |
-| 3.1840% | align-content | ✕ |
-| 3.1832% | flex-flow | ✕ |
-| 3.1774% | image-rendering | ✕ |
-| 3.0879% | webkit-margin-start | ✕ |
-| 2.9551% | font-stretch | ✕ |
-| 2.8934% | empty-cells | ✕ |
-| 2.7619% | webkit-margin-after | ✕ |
-| 2.7220% | perspective-origin | ✕ |
-| 2.6125% | webkit-margin-end | ✕ |
-| 2.6089% | column-count | ✕ |
-| 2.5880% | webkit-text-fill-color | ✕ |
-| 2.5466% | webkit-box-direction | ✕ |
-| 2.4618% | font-feature-settings | ✕ |
-| 2.3959% | webkit-mask-image | ✕ |
-| 2.3431% | webkit-padding-end | ✕ |
-| 2.2555% | stroke-dasharray | ✕ |
-| 2.1788% | user-select | ✕ |
-| 2.1679% | object-fit | ✕ |
-| 2.0643% | column-gap | ✕ |
-| 2.0459% | text-size-adjust | ✕ |
-| 2.0253% | caption-side | ✕ |
-| 1.9695% | stroke-dashoffset | ✕ |
-| 1.7923% | stroke-linecap | ✕ |
-| 1.7861% | animation-direction | ✕ |
-| 1.7559% | webkit-font-feature-settings | ✕ |
-| 1.7404% | stroke-opacity | ✕ |
-| 1.5926% | stroke-miterlimit | ✕ |
-| 1.5786% | fill-rule | ✕ |
-| 1.4859% | webkit-user-modify | ✕ |
-| 1.3439% | webkit-border-image | ✕ |
-| 1.3091% | animation-play-state | ✕ |
-| 1.2676% | contain | ✕ |
-| 1.2029% | webkit-padding-start | ✕ |
-| 1.1840% | webkit-margin-before | ✕ |
-| 1.1269% | page-break-before | ✕ |
-| 1.1222% | webkit-margin-top-collapse | ✕ |
-| 1.0418% | columns | ✕ |
-| 1.0354% | webkit-mask-size | ✕ |
-| 0.9650% | border-image-slice | ✕ |
-| 0.9425% | stop-color | ✕ |
-| 0.9408% | webkit-mask-repeat | ✕ |
-| 0.9125% | webkit-box-lines | ✕ |
-| 0.8804% | webkit-column-break-inside | ✕ |
-| 0.8752% | size | ✕ |
-| 0.8334% | font-kerning | ✕ |
-| 0.8034% | stroke-linejoin | ✕ |
-| 0.7869% | tab-size | ✕ |
-| 0.7689% | break-inside | ✕ |
-| 0.7589% | webkit-text-stroke-width | ✕ |
-| 0.7353% | column-width | ✕ |
-| 0.6924% | webkit-mask-position | ✕ |
-| 0.6869% | border-image-width | ✕ |
-| 0.6323% | border-image-repeat | ✕ |
-| 0.5994% | border-image-outset | ✕ |
-| 0.5885% | all | ✕ |
-| 0.5859% | webkit-text-stroke-color | ✕ |
-| 0.5435% | webkit-print-color-adjust | ✕ |
-| 0.5420% | webkit-text-stroke | ✕ |
-| 0.5195% | writing-mode | ✕ |
-| 0.4741% | clip-rule | ✕ |
-| 0.4685% | webkit-clip-path | ✕ |
-| 0.4578% | text-anchor | ✕ |
-| 0.4535% | shape-rendering | ✕ |
-| 0.4526% | webkit-column-break-before | ✕ |
-| 0.4494% | clip-path | ✕ |
-| 0.4452% | webkit-mask | ✕ |
-| 0.4393% | mix-blend-mode | ✕ |
-| 0.4166% | text-align-last | ✕ |
-| 0.4033% | column-rule | ✕ |
-| 0.3990% | webkit-mask-box-image | ✕ |
-| 0.3989% | font-variant-ligatures | ✕ |
-| 0.3881% | column-fill | ✕ |
-| 0.3865% | webkit-line-break | ✕ |
-| 0.3857% | border-image-source | ✕ |
-| 0.3528% | stop-opacity | ✕ |
-| 0.3075% | webkit-perspective-origin-y | ✕ |
-| 0.3054% | webkit-perspective-origin-x | ✕ |
-| 0.2994% | webkit-writing-mode | ✕ |
-| 0.2717% | dominant-baseline | ✕ |
-| 0.2634% | column-rule-color | ✕ |
-| 0.2586% | webkit-box-decoration-break | ✕ |
-| 0.2467% | webkit-text-security | ✕ |
-| 0.2374% | webkit-background-origin | ✕ |
-| 0.2146% | font-variant-caps | ✕ |
-| 0.2005% | column-rule-style | ✕ |
-| 0.1976% | shape-outside | ✕ |
-| 0.1971% | webkit-padding-before | ✕ |
-| 0.1896% | break-after | ✕ |
-| 0.1782% | webkit-padding-after | ✕ |
-| 0.1774% | text-orientation | ✕ |
-| 0.1747% | webkit-text-orientation | ✕ |
-| 0.1655% | mask | ✕ |
-| 0.1626% | alignment-baseline | ✕ |
-| 0.1572% | page | ✕ |
-| 0.1530% | webkit-column-break-after | ✕ |
-| 0.1521% | webkit-box-reflect | ✕ |
-| 0.1504% | webkit-text-emphasis-color | ✕ |
-| 0.1499% | object-position | ✕ |
-| 0.1470% | break-before | ✕ |
-| 0.1455% | webkit-margin-collapse | ✕ |
-| 0.1452% | baseline-shift | ✕ |
-| 0.1451% | hyphens | ✕ |
-| 0.1309% | rx | ✕ |
-| 0.1304% | ry | ✕ |
-| 0.1256% | background-blend-mode | ✕ |
-| 0.1136% | font-variant-numeric | ✕ |
-| 0.1135% | background-repeat-x | ✕ |
-| 0.1123% | background-repeat-y | ✕ |
-| 0.1086% | webkit-text-emphasis | ✕ |
-| 0.1058% | webkit-rtl-ordering | ✕ |
-| 0.1040% | column-rule-width | ✕ |
-| 0.1036% | isolation | ✕ |
-| 0.1002% | webkit-highlight | ✕ |
-| 0.0843% | webkit-transform-origin-y | ✕ |
-| 0.0786% | webkit-transform-origin-x | ✕ |
-| 0.0770% | webkit-app-region | ✕ |
-| 0.0685% | column-span | ✕ |
-| 0.0653% | r | ✕ |
-| 0.0611% | y | ✕ |
-| 0.0602% | x | ✕ |
-| 0.0555% | webkit-border-vertical-spacing | ✕ |
-| 0.0545% | webkit-border-horizontal-spacing | ✕ |
-| 0.0542% | webkit-border-start-width | ✕ |
-| 0.0450% | webkit-border-start-color | ✕ |
-| 0.0424% | webkit-border-after-width | ✕ |
-| 0.0424% | webkit-border-before-width | ✕ |
-| 0.0423% | webkit-border-end-width | ✕ |
-| 0.0351% | marker | ✕ |
-| 0.0349% | webkit-border-end-color | ✕ |
-| 0.0347% | webkit-border-after-color | ✕ |
-| 0.0347% | webkit-border-before-color | ✕ |
-| 0.0342% | mask-type | ✕ |
-| 0.0328% | color-interpolation-filters | ✕ |
-| 0.0325% | webkit-border-end | ✕ |
-| 0.0319% | vector-effect | ✕ |
-| 0.0307% | color-rendering | ✕ |
-
-## CSS Units and Values
-
-refs: https://drafts.csswg.org/css-values/ 2016-12-11
-
-### Textual
-
-* pre-defined keywords
- * CSS-wide keywords
- * `initial`
- * `inherit`
- * `unset`
-* `<custom-ident>`: author-defined identifiers ✓
-* `<string>`: quoted strings (`"xxx"`)
-* `<url>`: resourec locators (`url()`)
-
-### Numeric
-
-* `<integer>` ✓
-* `<number>` ✓
-* `<percentage>`
-
-### Length `<length>`
-
-* relative
- * font-relative
- * `em`
- * `ex`
- * `ch`
- * `ic`
- * `rem` ✓🔧
- * viewport-percentage
- * `vw` ✓🔧
- * `vh` ✓🔧
- * `vi`
- * `vb`
- * `vmin` ✓🔧
- * `vmax` ✓🔧
-* absolute
- * `cm` ✓🔧
- * `mm` ✓🔧
- * `Q` ✓🔧
- * `in` ✓🔧
- * `pc` ✓🔧
- * `pt` ✓🔧
- * `px` autofixed to number
-
-### Quantities
-
-* `<angle>`
- * `deg`
- * `grad`
- * `rad`
- * `turn`
-* `<time>`
- * `s`
- * `ms`
-* `<frequency>`
- * `Hz`
- * `kHz`
-* `<resolution>`
- * `dpi`
- * `dpcm`
- * `dppx`
-
-### Elsewhere
-
-* `<color>` ✓
-* `<image>`
-* `<position>`
-
-### Functional
-
-* `calc()`
-* `toggle()`
-* `attr()`
-
-## JS APIs
-
-refs: https://www.w3.org/standards/techs/js 2016-12-11
-
-### Completed Work
-
-#### Standards
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-11-17 | Media Source Extensions™ | - (media related) |
-| 2016-11-08 | Geolocation API Specification 2nd Edition | ✕ developing |
-| 2016-10-27 | Pointer Lock | - |
-| 2016-10-18 | Vibration API (Second Edition) | ✕ |
-| 2016-04-19 | Web Storage (Second Edition) | ✓ async `storage` module |
-| 2015-10-22 | Web Notifications | ✕ |
-| 2015-05-19 | HTML5 Web Messaging | ✕ `BroadcastChannel` developing |
-| 2015-02-24 | Pointer Events | - |
-| 2015-02-10 | Vibration API | ✕ |
-| 2015-02-03 | Server-Sent Events | ✕ |
-| 2015-01-08 | Indexed Database API | ✕ |
-| 2014-03-13 | Metadata API for Media Resources 1.0 | - (media related) |
-| 2014-02-11 | Progress Events | ✕ |
-| 2014-01-16 | JSON-LD 1.0 Processing Algorithms and API | - |
-| 2013-12-12 | Performance Timeline | - (perf related) |
-| 2013-12-12 | User Timing | - (perf related) |
-| 2013-10-31 | Widget Interface | - |
-| 2013-10-29 | Page Visibility (Second Edition) | ✕ `onviewappear`/`onviewdisappear` |
-| 2013-10-10 | Touch Events | ✕ |
-| 2013-02-21 | Selectors API Level 1 | - |
-| 2012-12-17 | Navigation Timing | - (perf related) |
-| 2012-12-17 | High Resolution Time | - (perf related) |
-| 2008-12-22 | Element Traversal Specification | - |
-
-### Drafts
-
-#### Proposed Recommendations
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-09-15 | WebIDL Level 1 | - |
-
-#### Candidate Recommendations
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-12-08 | Performance Timeline Level 2 | - (perf related) |
-| 2016-11-22 | Page Visibility Level 2 | ✕ `onviewappear`/`onviewdisappear` |
-| 2016-11-01 | High Resolution Time Level 2 | - (perf related) |
-| 2016-08-18 | DeviceOrientation Event Specification | ✕ |
-| 2016-07-21 | Resource Timing Level 1 | - (perf related) |
-| 2016-07-14 | Presentation API | - |
-| 2016-07-07 | Battery Status API | ✕ |
-| 2016-07-05 | Encrypted Media Extensions | - |
-| 2016-05-19 | Media Capture and Streams | - (media related) |
-| 2014-12-11 | Web Cryptography API | - |
-| 2014-09-09 | HTML Media Capture | - (media related) |
-| 2012-09-20 | The WebSocket API | ✕ |
-
-#### Last Call Drafts
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2011-12-01 | Geolocation API Specification Level 2 | ✕ |
-
-#### Other Working Drafts
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-12-09 | MediaStream Image Capture | - (media related) |
-| 2016-12-06 | MediaStream Recording | - (media related) |
-| 2016-12-06 | Selection API | ✕ |
-| 2016-12-05 | Input Events | ✕ |
-| 2016-12-02 | Gamepad | - |
-| 2016-11-29 | WebDriver | - |
-| 2016-11-24 | WebRTC 1.0: Real-time Communication Between Browsers | ✕ |
-| 2016-11-22 | Pointer Lock 2.0 | - |
-| 2016-11-07 | Remote Playback API | - (media related) |
-| 2016-11-03 | Resource Timing Level 2 | - (perf related) |
-| 2016-11-02 | Audio Output Devices API | - (media related) |
-| 2016-11-01 | Indexed Database API 2.0 | ✕ |
-| 2016-11-01 | User Timing Level 2 | - (perf related) |
-| 2016-10-31 | The Screen Orientation API | ✕ |
-| 2016-10-31 | High Resolution Time Level 3 | - (perf related) |
-| 2016-10-24 | UI Events KeyboardEvent code Values | - |
-| 2016-10-24 | UI Events KeyboardEvent key Values | - |
-| 2016-10-11 | Service Workers 1 | ✕ |
-| 2016-09-21 | Identifiers for WebRTC's Statistics API | - |
-| 2016-09-13 | Accelerometer Sensor | ✕ |
-| 2016-09-13 | Gyroscope Sensor | ✕ |
-| 2016-09-13 | Magnetometer Sensor | ✕ |
-| 2016-08-30 | Ambient Light Sensor | ✕ |
-| 2016-08-30 | Media Capture from DOM Elements | - (media related) |
-| 2016-08-30 | Generic Sensor API | ✕ |
-| 2016-08-03 | Wake Lock API | ✕ |
-| 2016-07-19 | Proximity Sensor | ✕ |
-| 2016-07-19 | Pointer Events - Level 2 | - |
-| 2016-07-14 | Screen Capture | ✕ |
-| 2016-07-12 | Media Capture Depth Stream Extensions | - (media related) |
-| 2016-05-17 | Cooperative Scheduling of Background Tasks | ✕ |
-| 2016-04-22 | Navigation Timing Level 2 | - (perf related) |
-| 2016-04-03 | Clipboard API and events | ✕ `clipboard` module |
-| 2015-12-15 | Push API | ✕ |
-| 2015-12-08 | Web Audio API | - (media related) |
-| 2015-10-15 | FindText API | - |
-| 2015-09-24 | Web Workers | ✕ |
-| 2015-04-21 | File API | ✕ |
-| 2014-02-20 | Network Service Discovery | ✕ |
-| 2012-03-06 | MediaStream Capture Scenarios | - (media related) |
-| 2011-12-15 | Audio Processing API | - (media related) |
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_draft/web-standards.md
----------------------------------------------------------------------
diff --git a/_draft/web-standards.md b/_draft/web-standards.md
deleted file mode 100644
index 3125796..0000000
--- a/_draft/web-standards.md
+++ /dev/null
@@ -1,585 +0,0 @@
----
-title: Web 标准
-type: references
-group: API
-order: 2.7
-version: 2.1
-has_chapter_content: true
----
-
-# Weex 中的 Web 标准
-
-## HTML
-
-refs: https://www.advancedwebranking.com/html/ 2016-12-11
-
-### Overview
-
-| percentage | name | supported |
-| ---- | ---- | ---- |
-| 98.1% | `<head>` | - |
-| 97.9% | `<body>` | - |
-| 97.9% | `<html>` | - |
-| 97% | `<title>` | - |
-| 93.9% | `<meta>` | - |
-| 89.9% | `<div>` | ✓ |
-| 89.6% | `<a>` | ✓ |
-| 88.5% | `<script>` | ✓ |
-| 86.5% | `<link>` | - |
-| 86.3% | `<img>` | ✓ |
-| 81.5% | `<p>` | - (can be customized) |
-| 75.6% | `<span>` | - (can be customized) |
-| 73.8% | `<li>` | - (can be customized) |
-| 73.7% | `<ul>` | - (can be customized) |
-| 70.3% | `<br>` | ✕ |
-| 60.4% | `<style>` | ✓ |
-| 55.8% | `<h1>` | - (can be customized) |
-| 52.7% | `<h2>` | - (can be customized) |
-| 48.4% | `<input>` | ✓ |
-| 46.9% | `<form>` | ✕ |
-| 44.3% | `<strong>` | - (can be customized) |
-| 43.1% | `<h3>` | - (can be customized) |
-| 30.9% | `<table>` | ✕ |
-| 30.3% | `<tr>` | ✕ |
-| 30.2% | `<td>` | ✕ |
-
-### Forms
-
-| percentage | name | supported |
-| ---- | ---- | ---- |
-| 49.5% | `<option>` | ✕ |
-| 30.2% | `<input>` | ✓ |
-| 16.6% | > `[type="hidden"]` | - |
-| 8% | > `[type="text"]` | ✓ |
-| 4.2% | > `[type="submit"]` | - |
-| 2% | > `[type="checkbox"]` | - (`<switch>`) |
-| 1.2% | > `[type="email"]` | ✓ |
-| 1.1% | > `[type="radio"]` | ✕ |
-| 0.9% | > `[type="image"]` | - |
-| 0.8% | > `[type="button"]` | - |
-| 0.6% | > `[type="search"]` | ✕ |
-| 0.6% | > `[type="password"]` | ✓ |
-| 0.1% | > `[type="tel"]` | ✓ |
-| 0.1% | > `[type="number"]` | ✓ |
-| 0% | > `[type="reset"]` | - |
-| 0% | > `[type="file"]` | ✕ |
-| 0% | > `[type="date"]` | ✓ |
-| 0% | > `[type="url"]` | ✓ |
-| 0% | > `[type="range"]` | ✕ |
-| 0% | > `[type="color"]` | ✕ |
-| 0% | > `[type="time"]` | ✓ |
-| 0% | > `[type="datetime-local"]` | ✕ |
-| 7.2% | `<label>` | - |
-| 6.1% | `<form>` | - |
-| 3.7% | `<button>` | - (can be customized) |
-| 2.6% | > `[type="button"]` | - |
-| 1.3% | > `[type="submit"]` | - |
-| 0% | > `[type="reset"]` | - |
-| 1.9% | `<select>` | ✕ |
-| 0.7% | `<textarea>` | ✓ |
-| 0.5% | `<fieldset>` | - |
-| 0.1% | `<optgroup>` | ✕ |
-| 0.1% | `<legend>` | - |
-| 0% | `<progress>` | ✕ |
-| 0% | `<datalist>` | - |
-| 0% | `<output>` | - |
-| 0% | `<meter>` | - |
-
-## CSS Properties
-
-refs: https://www.chromestatus.com/metrics/feature/popularity 2016-12-11
-
-| percentage | name | supported |
-| ---- | ---- | ---- |
-| 90.5115% | display | ✕ `flex` only |
-| 89.8243% | margin | ✓ (not support combo) |
-| 88.7012% | width | ✓ |
-| 88.6468% | overflow | ✓ iOS only, `hidden` only for Android |
-| 88.6432% | background-color | ✓ |
-| 88.0803% | height | ✓ |
-| 87.7648% | font-size | ✓ |
-| 87.3837% | padding | ✓ |
-| 87.2721% | color | ✓ |
-| 86.9788% | text-align | ✓ |
-| 86.6841% | position | ✓ `relative` by default, `static` not supported |
-| 86.6039% | font-family | ✓ |
-| 86.5943% | font-weight | ✓ |
-| 85.0072% | opacity | ✓ |
-| 80.6911% | max-width | ✕ |
-| 79.4476% | box-sizing | ✕ `border-box` only |
-| 75.7623% | max-height | ✕ |
-| 74.9939% | webkit-user-select | ✕ |
-| 57.0292% | align-items | ✓ |
-| 56.8182% | justify-content | ✓ `space-around` not supported well in browser |
-| 50.5941% | flex-direction | ✓ |
-| 48.5052% | border | ✓ |
-| 47.5161% | top | ✓ |
-| 46.9136% | background | ✕ |
-| 46.1552% | cursor | ✕ |
-| 46.1443% | margin-left | ✓ |
-| 46.0956% | left | ✓ |
-| 46.0848% | text-decoration | ✓ |
-| 45.9575% | float | ✕ |
-| 45.8391% | border-bottom | ✓ |
-| 45.7639% | padding-left | ✓ |
-| 45.7128% | margin-top | ✓ |
-| 45.7013% | line-height | ✓ |
-| 45.5836% | background-image | ✕ |
-| 45.0837% | z-index | ✕ |
-| 45.0649% | right | ✓ |
-| 45.0516% | margin-bottom | ✓ |
-| 45.0459% | white-space | ✕ |
-| 44.8710% | margin-right | ✓ |
-| 44.8476% | vertical-align | ✕ |
-| 44.6306% | padding-top | ✓ |
-| 44.1466% | border-radius | ✓ |
-| 44.0136% | border-top | ✓ |
-| 43.9815% | padding-bottom | ✓ |
-| 43.9392% | padding-right | ✓ |
-| 43.8539% | visibility | ✕ |
-| 43.4306% | background-position | ✕ |
-| 43.4098% | background-repeat | ✕ |
-| 43.0391% | clear | ✕ |
-| 42.9100% | bottom | ✓ |
-| 42.2092% | content | ✕ |
-| 42.0690% | box-shadow | ✕ |
-| 41.9004% | border-color | ✓ |
-| 41.7341% | outline | ✕ |
-| 41.4297% | border-right | ✓ |
-| 41.2605% | border-left | ✓ |
-| 41.1127% | min-height | ✕ |
-| 41.0736% | font-style | ✓ |
-| 41.0523% | min-width | ✕ |
-| 40.4298% | list-style | ✕ |
-| 39.7341% | font | ✕ |
-| 38.8999% | background-size | ✕ |
-| 38.7811% | border-width | ✓ |
-| 38.7718% | border-collapse | ✕ |
-| 37.8110% | border-style | ✓ |
-| 37.4962% | text-overflow | ✓ must work with `lines` |
-| 37.3471% | text-transform | ✕ |
-| 37.2154% | transition | ✕ |
-| 36.5155% | overflow-y | ✕ |
-| 36.3025% | transform | ✕ |
-| 36.2488% | text-indent | ✕ |
-| 35.5075% | text-shadow | ✕ |
-| 34.7607% | webkit-appearance | ✕ |
-| 34.1925% | list-style-type | ✕ |
-| 34.0238% | border-spacing | ✕ |
-| 33.6664% | word-wrap | ✕ |
-| 31.9961% | overflow-x | ✕ |
-| 31.9922% | zoom | ✕ |
-| 31.2495% | border-bottom-left-radius | ✕ |
-| 31.1306% | pointer-events | ✕ |
-| 31.1229% | border-top-left-radius | ✕ |
-| 30.2131% | border-bottom-color | ✓ |
-| 29.9608% | border-top-color | ✓ |
-| 29.4297% | border-bottom-right-radius | ✕ |
-| 29.2668% | border-top-right-radius | ✕ |
-| 28.6489% | letter-spacing | ✕ |
-| 27.8327% | animation | ✕ |
-| 26.6738% | border-right-width | ✓ |
-| 26.0169% | src | ✕ |
-| 25.2661% | clip | ✕ |
-| 25.2512% | webkit-font-smoothing | ✕ |
-| 25.1971% | border-bottom-width | ✓ |
-| 25.0246% | border-right-color | ✓ |
-| 24.7790% | direction | ✕ |
-| 24.4094% | webkit-tap-highlight-color | ✕ |
-| 23.9751% | border-left-color | ✓ |
-| 23.9321% | border-top-width | ✓ |
-| 23.7902% | fill | ✕ |
-| 23.2617% | border-left-width | ✓ |
-| 22.7278% | table-layout | ✕ |
-| 21.5766% | word-break | ✕ |
-| 20.4319% | background-clip | ✕ |
-| 19.3198% | transform-origin | ✕ |
-| 18.9233% | filter | ✕ |
-| 17.7879% | resize | ✕ |
-| 16.2501% | flex | ✕ |
-| 15.1656% | font-variant | ✕ |
-| 14.9181% | text-rendering | ✕ |
-| 14.7125% | webkit-filter | ✕ |
-| 14.5263% | transition-duration | ✕ |
-| 14.3966% | transition-property | ✕ |
-| 14.2124% | webkit-box-orient | ✕ |
-| 13.5432% | outline-offset | ✕ |
-| 12.9300% | transition-timing-function | ✕ |
-| 12.2788% | unicode-range | ✕ |
-| 12.0880% | word-spacing | ✕ |
-| 11.9124% | quotes | ✕ |
-| 11.6800% | border-bottom-style | ✓ |
-| 11.4263% | webkit-background-clip | ✕ |
-| 11.0070% | flex-grow | ✕ |
-| 10.5925% | backface-visibility | ✕ |
-| 10.4417% | animation-name | ✕ |
-| 10.4302% | stroke | ✕ |
-| 10.4144% | animation-duration | ✕ |
-| 10.2804% | touch-action | ✕ |
-| 9.9663% | list-style-position | ✕ |
-| 9.8662% | order | ✕ |
-| 9.7770% | outline-width | ✕ |
-| 9.7504% | transition-delay | ✕ |
-| 9.4689% | border-top-style | ✓ |
-| 9.3474% | webkit-box-pack | ✕ |
-| 9.3078% | webkit-box-align | ✕ |
-| 9.2375% | page-break-inside | ✕ |
-| 9.1898% | webkit-line-clamp | ✕ |
-| 8.9350% | list-style-image | ✕ |
-| 8.8339% | page-break-after | ✕ |
-| 8.5735% | speak | ✕ |
-| 8.4754% | unicode-bidi | ✕ |
-| 8.4307% | animation-timing-function | ✕ |
-| 8.1464% | webkit-box-flex | ✕ |
-| 8.0048% | orphans | ✕ |
-| 7.9947% | widows | ✕ |
-| 7.6671% | flex-wrap | ✓ not supported well in browser |
-| 7.5756% | animation-fill-mode | ✕ |
-| 7.4163% | animation-delay | ✕ |
-| 7.3284% | border-left-style | ✓ |
-| 7.1586% | outline-color | ✕ |
-| 6.9102% | flex-shrink | ✕ |
-| 6.7754% | perspective | ✕ |
-| 6.7748% | border-right-style | ✓ |
-| 6.4619% | outline-style | ✕ |
-| 6.0382% | animation-iteration-count | ✕ |
-| 5.9838% | background-origin | ✕ |
-| 5.9714% | fill-opacity | ✕ |
-| 5.9357% | will-change | ✕ |
-| 5.3740% | stroke-width | ✕ |
-| 5.3172% | transform-style | ✕ |
-| 5.2608% | overflow-wrap | ✕ |
-| 5.1730% | background-attachment | ✕ |
-| 4.9039% | counter-increment | ✕ |
-| 4.5950% | counter-reset | ✕ |
-| 4.5031% | align-self | ✕ |
-| 4.4109% | webkit-box-ordinal-group | ✕ |
-| 4.4046% | webkit-animation-direction | ✕ |
-| 3.7598% | background-position-x | ✕ |
-| 3.6867% | border-image | ✕ |
-| 3.6601% | background-position-y | ✕ |
-| 3.5749% | webkit-user-drag | ✕ |
-| 3.3376% | flex-basis | ✕ |
-| 3.1840% | align-content | ✕ |
-| 3.1832% | flex-flow | ✕ |
-| 3.1774% | image-rendering | ✕ |
-| 3.0879% | webkit-margin-start | ✕ |
-| 2.9551% | font-stretch | ✕ |
-| 2.8934% | empty-cells | ✕ |
-| 2.7619% | webkit-margin-after | ✕ |
-| 2.7220% | perspective-origin | ✕ |
-| 2.6125% | webkit-margin-end | ✕ |
-| 2.6089% | column-count | ✕ |
-| 2.5880% | webkit-text-fill-color | ✕ |
-| 2.5466% | webkit-box-direction | ✕ |
-| 2.4618% | font-feature-settings | ✕ |
-| 2.3959% | webkit-mask-image | ✕ |
-| 2.3431% | webkit-padding-end | ✕ |
-| 2.2555% | stroke-dasharray | ✕ |
-| 2.1788% | user-select | ✕ |
-| 2.1679% | object-fit | ✕ |
-| 2.0643% | column-gap | ✕ |
-| 2.0459% | text-size-adjust | ✕ |
-| 2.0253% | caption-side | ✕ |
-| 1.9695% | stroke-dashoffset | ✕ |
-| 1.7923% | stroke-linecap | ✕ |
-| 1.7861% | animation-direction | ✕ |
-| 1.7559% | webkit-font-feature-settings | ✕ |
-| 1.7404% | stroke-opacity | ✕ |
-| 1.5926% | stroke-miterlimit | ✕ |
-| 1.5786% | fill-rule | ✕ |
-| 1.4859% | webkit-user-modify | ✕ |
-| 1.3439% | webkit-border-image | ✕ |
-| 1.3091% | animation-play-state | ✕ |
-| 1.2676% | contain | ✕ |
-| 1.2029% | webkit-padding-start | ✕ |
-| 1.1840% | webkit-margin-before | ✕ |
-| 1.1269% | page-break-before | ✕ |
-| 1.1222% | webkit-margin-top-collapse | ✕ |
-| 1.0418% | columns | ✕ |
-| 1.0354% | webkit-mask-size | ✕ |
-| 0.9650% | border-image-slice | ✕ |
-| 0.9425% | stop-color | ✕ |
-| 0.9408% | webkit-mask-repeat | ✕ |
-| 0.9125% | webkit-box-lines | ✕ |
-| 0.8804% | webkit-column-break-inside | ✕ |
-| 0.8752% | size | ✕ |
-| 0.8334% | font-kerning | ✕ |
-| 0.8034% | stroke-linejoin | ✕ |
-| 0.7869% | tab-size | ✕ |
-| 0.7689% | break-inside | ✕ |
-| 0.7589% | webkit-text-stroke-width | ✕ |
-| 0.7353% | column-width | ✕ |
-| 0.6924% | webkit-mask-position | ✕ |
-| 0.6869% | border-image-width | ✕ |
-| 0.6323% | border-image-repeat | ✕ |
-| 0.5994% | border-image-outset | ✕ |
-| 0.5885% | all | ✕ |
-| 0.5859% | webkit-text-stroke-color | ✕ |
-| 0.5435% | webkit-print-color-adjust | ✕ |
-| 0.5420% | webkit-text-stroke | ✕ |
-| 0.5195% | writing-mode | ✕ |
-| 0.4741% | clip-rule | ✕ |
-| 0.4685% | webkit-clip-path | ✕ |
-| 0.4578% | text-anchor | ✕ |
-| 0.4535% | shape-rendering | ✕ |
-| 0.4526% | webkit-column-break-before | ✕ |
-| 0.4494% | clip-path | ✕ |
-| 0.4452% | webkit-mask | ✕ |
-| 0.4393% | mix-blend-mode | ✕ |
-| 0.4166% | text-align-last | ✕ |
-| 0.4033% | column-rule | ✕ |
-| 0.3990% | webkit-mask-box-image | ✕ |
-| 0.3989% | font-variant-ligatures | ✕ |
-| 0.3881% | column-fill | ✕ |
-| 0.3865% | webkit-line-break | ✕ |
-| 0.3857% | border-image-source | ✕ |
-| 0.3528% | stop-opacity | ✕ |
-| 0.3075% | webkit-perspective-origin-y | ✕ |
-| 0.3054% | webkit-perspective-origin-x | ✕ |
-| 0.2994% | webkit-writing-mode | ✕ |
-| 0.2717% | dominant-baseline | ✕ |
-| 0.2634% | column-rule-color | ✕ |
-| 0.2586% | webkit-box-decoration-break | ✕ |
-| 0.2467% | webkit-text-security | ✕ |
-| 0.2374% | webkit-background-origin | ✕ |
-| 0.2146% | font-variant-caps | ✕ |
-| 0.2005% | column-rule-style | ✕ |
-| 0.1976% | shape-outside | ✕ |
-| 0.1971% | webkit-padding-before | ✕ |
-| 0.1896% | break-after | ✕ |
-| 0.1782% | webkit-padding-after | ✕ |
-| 0.1774% | text-orientation | ✕ |
-| 0.1747% | webkit-text-orientation | ✕ |
-| 0.1655% | mask | ✕ |
-| 0.1626% | alignment-baseline | ✕ |
-| 0.1572% | page | ✕ |
-| 0.1530% | webkit-column-break-after | ✕ |
-| 0.1521% | webkit-box-reflect | ✕ |
-| 0.1504% | webkit-text-emphasis-color | ✕ |
-| 0.1499% | object-position | ✕ |
-| 0.1470% | break-before | ✕ |
-| 0.1455% | webkit-margin-collapse | ✕ |
-| 0.1452% | baseline-shift | ✕ |
-| 0.1451% | hyphens | ✕ |
-| 0.1309% | rx | ✕ |
-| 0.1304% | ry | ✕ |
-| 0.1256% | background-blend-mode | ✕ |
-| 0.1136% | font-variant-numeric | ✕ |
-| 0.1135% | background-repeat-x | ✕ |
-| 0.1123% | background-repeat-y | ✕ |
-| 0.1086% | webkit-text-emphasis | ✕ |
-| 0.1058% | webkit-rtl-ordering | ✕ |
-| 0.1040% | column-rule-width | ✕ |
-| 0.1036% | isolation | ✕ |
-| 0.1002% | webkit-highlight | ✕ |
-| 0.0843% | webkit-transform-origin-y | ✕ |
-| 0.0786% | webkit-transform-origin-x | ✕ |
-| 0.0770% | webkit-app-region | ✕ |
-| 0.0685% | column-span | ✕ |
-| 0.0653% | r | ✕ |
-| 0.0611% | y | ✕ |
-| 0.0602% | x | ✕ |
-| 0.0555% | webkit-border-vertical-spacing | ✕ |
-| 0.0545% | webkit-border-horizontal-spacing | ✕ |
-| 0.0542% | webkit-border-start-width | ✕ |
-| 0.0450% | webkit-border-start-color | ✕ |
-| 0.0424% | webkit-border-after-width | ✕ |
-| 0.0424% | webkit-border-before-width | ✕ |
-| 0.0423% | webkit-border-end-width | ✕ |
-| 0.0351% | marker | ✕ |
-| 0.0349% | webkit-border-end-color | ✕ |
-| 0.0347% | webkit-border-after-color | ✕ |
-| 0.0347% | webkit-border-before-color | ✕ |
-| 0.0342% | mask-type | ✕ |
-| 0.0328% | color-interpolation-filters | ✕ |
-| 0.0325% | webkit-border-end | ✕ |
-| 0.0319% | vector-effect | ✕ |
-| 0.0307% | color-rendering | ✕ |
-
-## CSS Units and Values
-
-refs: https://drafts.csswg.org/css-values/ 2016-12-11
-
-### Textual
-
-* pre-defined keywords
- * CSS-wide keywords
- * `initial`
- * `inherit`
- * `unset`
-* `<custom-ident>`: author-defined identifiers ✓
-* `<string>`: quoted strings (`"xxx"`)
-* `<url>`: resourec locators (`url()`)
-
-### Numeric
-
-* `<integer>` ✓
-* `<number>` ✓
-* `<percentage>`
-
-### Length `<length>`
-
-* relative
- * font-relative
- * `em`
- * `ex`
- * `ch`
- * `ic`
- * `rem` ✓🔧
- * viewport-percentage
- * `vw` ✓🔧
- * `vh` ✓🔧
- * `vi`
- * `vb`
- * `vmin` ✓🔧
- * `vmax` ✓🔧
-* absolute
- * `cm` ✓🔧
- * `mm` ✓🔧
- * `Q` ✓🔧
- * `in` ✓🔧
- * `pc` ✓🔧
- * `pt` ✓🔧
- * `px` autofixed to number
-
-### Quantities
-
-* `<angle>`
- * `deg`
- * `grad`
- * `rad`
- * `turn`
-* `<time>`
- * `s`
- * `ms`
-* `<frequency>`
- * `Hz`
- * `kHz`
-* `<resolution>`
- * `dpi`
- * `dpcm`
- * `dppx`
-
-### Elsewhere
-
-* `<color>` ✓
-* `<image>`
-* `<position>`
-
-### Functional
-
-* `calc()`
-* `toggle()`
-* `attr()`
-
-## JS APIs
-
-refs: https://www.w3.org/standards/techs/js 2016-12-11
-
-### Completed Work
-
-#### Standards
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-11-17 | Media Source Extensions™ | - (media related) |
-| 2016-11-08 | Geolocation API Specification 2nd Edition | ✕ developing |
-| 2016-10-27 | Pointer Lock | - |
-| 2016-10-18 | Vibration API (Second Edition) | ✕ |
-| 2016-04-19 | Web Storage (Second Edition) | ✓ async `storage` module |
-| 2015-10-22 | Web Notifications | ✕ |
-| 2015-05-19 | HTML5 Web Messaging | ✕ `BroadcastChannel` developing |
-| 2015-02-24 | Pointer Events | - |
-| 2015-02-10 | Vibration API | ✕ |
-| 2015-02-03 | Server-Sent Events | ✕ |
-| 2015-01-08 | Indexed Database API | ✕ |
-| 2014-03-13 | Metadata API for Media Resources 1.0 | - (media related) |
-| 2014-02-11 | Progress Events | ✕ |
-| 2014-01-16 | JSON-LD 1.0 Processing Algorithms and API | - |
-| 2013-12-12 | Performance Timeline | - (perf related) |
-| 2013-12-12 | User Timing | - (perf related) |
-| 2013-10-31 | Widget Interface | - |
-| 2013-10-29 | Page Visibility (Second Edition) | ✕ `onviewappear`/`onviewdisappear` |
-| 2013-10-10 | Touch Events | ✕ |
-| 2013-02-21 | Selectors API Level 1 | - |
-| 2012-12-17 | Navigation Timing | - (perf related) |
-| 2012-12-17 | High Resolution Time | - (perf related) |
-| 2008-12-22 | Element Traversal Specification | - |
-
-### Drafts
-
-#### Proposed Recommendations
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-09-15 | WebIDL Level 1 | - |
-
-#### Candidate Recommendations
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-12-08 | Performance Timeline Level 2 | - (perf related) |
-| 2016-11-22 | Page Visibility Level 2 | ✕ `onviewappear`/`onviewdisappear` |
-| 2016-11-01 | High Resolution Time Level 2 | - (perf related) |
-| 2016-08-18 | DeviceOrientation Event Specification | ✕ |
-| 2016-07-21 | Resource Timing Level 1 | - (perf related) |
-| 2016-07-14 | Presentation API | - |
-| 2016-07-07 | Battery Status API | ✕ |
-| 2016-07-05 | Encrypted Media Extensions | - |
-| 2016-05-19 | Media Capture and Streams | - (media related) |
-| 2014-12-11 | Web Cryptography API | - |
-| 2014-09-09 | HTML Media Capture | - (media related) |
-| 2012-09-20 | The WebSocket API | ✕ |
-
-#### Last Call Drafts
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2011-12-01 | Geolocation API Specification Level 2 | ✕ |
-
-#### Other Working Drafts
-
-| last update | spec | supported |
-| ---- | ---- | ---- |
-| 2016-12-09 | MediaStream Image Capture | - (media related) |
-| 2016-12-06 | MediaStream Recording | - (media related) |
-| 2016-12-06 | Selection API | ✕ |
-| 2016-12-05 | Input Events | ✕ |
-| 2016-12-02 | Gamepad | - |
-| 2016-11-29 | WebDriver | - |
-| 2016-11-24 | WebRTC 1.0: Real-time Communication Between Browsers | ✕ |
-| 2016-11-22 | Pointer Lock 2.0 | - |
-| 2016-11-07 | Remote Playback API | - (media related) |
-| 2016-11-03 | Resource Timing Level 2 | - (perf related) |
-| 2016-11-02 | Audio Output Devices API | - (media related) |
-| 2016-11-01 | Indexed Database API 2.0 | ✕ |
-| 2016-11-01 | User Timing Level 2 | - (perf related) |
-| 2016-10-31 | The Screen Orientation API | ✕ |
-| 2016-10-31 | High Resolution Time Level 3 | - (perf related) |
-| 2016-10-24 | UI Events KeyboardEvent code Values | - |
-| 2016-10-24 | UI Events KeyboardEvent key Values | - |
-| 2016-10-11 | Service Workers 1 | ✕ |
-| 2016-09-21 | Identifiers for WebRTC's Statistics API | - |
-| 2016-09-13 | Accelerometer Sensor | ✕ |
-| 2016-09-13 | Gyroscope Sensor | ✕ |
-| 2016-09-13 | Magnetometer Sensor | ✕ |
-| 2016-08-30 | Ambient Light Sensor | ✕ |
-| 2016-08-30 | Media Capture from DOM Elements | - (media related) |
-| 2016-08-30 | Generic Sensor API | ✕ |
-| 2016-08-03 | Wake Lock API | ✕ |
-| 2016-07-19 | Proximity Sensor | ✕ |
-| 2016-07-19 | Pointer Events - Level 2 | - |
-| 2016-07-14 | Screen Capture | ✕ |
-| 2016-07-12 | Media Capture Depth Stream Extensions | - (media related) |
-| 2016-05-17 | Cooperative Scheduling of Background Tasks | ✕ |
-| 2016-04-22 | Navigation Timing Level 2 | - (perf related) |
-| 2016-04-03 | Clipboard API and events | ✕ `clipboard` module |
-| 2015-12-15 | Push API | ✕ |
-| 2015-12-08 | Web Audio API | - (media related) |
-| 2015-10-15 | FindText API | - |
-| 2015-09-24 | Web Workers | ✕ |
-| 2015-04-21 | File API | ✕ |
-| 2014-02-20 | Network Service Discovery | ✕ |
-| 2012-03-06 | MediaStream Capture Scenarios | - (media related) |
-| 2011-12-15 | Audio Processing API | - (media related) |
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_draft/weex-dom-api.md
----------------------------------------------------------------------
diff --git a/_draft/weex-dom-api.md b/_draft/weex-dom-api.md
deleted file mode 100644
index f18efa0..0000000
--- a/_draft/weex-dom-api.md
+++ /dev/null
@@ -1,224 +0,0 @@
----
-title: Native DOM APIs
-type: references
-group: API
-order: 2.8
-version: 2.1
-has_chapter_content: true
----
-
-# Native DOM APIs
-
-Weex 在 JS 引擎中，为每个页面都提供了一套 Native DOM APIs，这套接口和 HTML DOM APIs 非常接近，利用这套接口我们可以通过 JavaScript 控制 native 的渲染逻辑。而且 Weex 上层的 Vue 2.0 也是基于这套接口进行适配的。
-
-*绝大多数情况下 JS 框架会把 Native DOM APIs 都封装好，开发者不需要直接对 Native DOM 进行操作。*
-
-* `Document` 类，整个页面文档。
-* `Node` 类，结点的基础类。
-* `Element` 类，元素结点，继承自 `Node`，单个视图单元。
-* `Comment` 类，注释结点，继承自 `Node`，无实际意义，通常用作占位符。
-
-**每个 Weex 页面都有一个 `weex.document` 对象，该对象就是一个 `Document` 类的实例，也是下面所有接口调用的起点。**
-
-接下来详细介绍它们的用法：
-
-## `Document` 类
-
-每个 `Document` 实例在创建的时候都会自动拥有一个 `documentElement` 属性，表示文档结点。该文档结点可以拥有一个 `body`，即文档的主体结点。
-
-**注意事项**: 文档的主体结点只接受 `<div>`、`<list>` 或 `<scroller>` 三种类型的元素结点。
-
-### 构造函数
-
-**`new Document(id: string, url: string?)`**
-
-### 成员方法
-
-**`createElement(tagName: string, props: Object?): Element`**
-
-* 创建一个特定类型 `tagName` 的 `Element` 实例，即一个元素结点。`props` 可以包含 `attr` 对象和 `style` 对象。比如 `createBody('div', {style: {backgroundColor: '#ffffff'}})`。
-
-**`createComment(text: string): Comment`**
-
-* 创建一个 `Comment` 的实例，即一个注释结点，并设置一段文本描述。
-
-**`createBody(tagName: string, props: Object?): Element`**
-
-* 创建文档主体结点，并自动挂载到 `documentElement` 下。
-
-**`fireEvent(el: Element, type: string, e: Object?, domChanges: Object?)`**
-
-* 触发一个特定类型的事件，并附带一个事件对象 `e`。当该事件在产生过程中修改了 DOM 的特性或样式，则第四个参数用来描述这些改变，参数格式和上面 `createElement` 方法的格式相同。
-
-**`destroy()`**
-
-* 销毁当前文档。一旦销毁之后文档将不会再工作。
-
-### 只读成员变量
-
-**`id: string`**
-
-* 每个 `Document` 实例都有一个唯一的 `id`。这同时也是每个 Weex 页面唯一拥有的 `id`。
-
-**`URL: string?`**
-
-* 如果当前 Weex 页面有 JS bundle URL 的话，这里则会返回 这个 URL。
-
-**`body: Element`**
-
-* 文档的主体结点，概念类似 HTML DOM 里的 `document.body`。
-
-**`documentElement: Element`**
-
-* 文档的对应结点，概念类似 HTML DOM 里的 `document.documentElement`。
-* `body` 和 `documentElement` 的关系是：`documentElement` 是 `body` 的父结点。
-
-**`getRef(id): Node`**
-
-* 根据结点 id 获取结点。
-
-## `Node` 类
-
-### 构造函数
-
-**`new Node()`**
-
-### 成员
-
-**`destroy()`**
-
-### 只读成员变量或方法
-
-**`ref: string`**
-
-* 每个 `Node` 实例都有各自的在整个 `Document` 实例中唯一的 `ref` 值。
-
-**`nextSibling: Node?`**
-
-**`previousSibling: Node?`**
-
-**`parentNode: Node?`**
-
-* 上述三个接口和 HTML DOM 的定义吻合。
-
-**`children: Node[]`**
-
-* 该结点拥有的所有子结点的数组。
-
-**`pureChildren: Node[]`**
-
-* 该结点拥有的所有子元素的数组。和 `children` 的区别是，`pureChildren` 只包含了 `Element` 实例而不包含 `Comment` 实例。
-
-## `Element` 类 <small>继承自 `Node`</small>
-
-### 构造函数
-
-**`new Element(type: string, props: Object?)`**
-
-* 创建一个特定类型 `type` 的元素结点，参数 `props` 可以包含 `attr` 对象或 `style` 对象。
-
-### DOM 树操作
-
-**`appendChild(node: Node)`**
-
-**`insertBefore(node: Node, before: Node?)`**
-
-* 上述两个接口类似 HTML DOM。
-
-**`insertAfter(node: Node, after: Node?)`**
-
-* 在一个子结点之前插入新结点 after。
-
-**`removeChild(node: Node, preserved: boolean?)`**
-
-* 删除子结点 `node`，参数 `preserved` 表示立刻从内存中删除还是暂时保留。
-
-**`clear()`**
-
-* 清除所有的子结点。
-
-### DOM 属性本身操作
-
-**`setAttr(key: string, value: string, silent: boolean?)`**
-
-**`setStyle(key: string, value: string, silent: boolean?)`**
-
-* 上述两个接口中，当 `silent` 为真的时候，结点仅更新自己，不会传递命令给客户端渲染层。该参数用来处理用户事件在发生时已经改变结点相关属性的情况下，不会在 Native DOM 也改变之后重复发送命令给客户端。
-
-**`addEvent(type: string, handler: Function)`**
-
-**`removeEvent(type: string)`**
-
-**`fireEvent(type: string, e: any)`**
-
-* 绑定事件、解绑定事件、触发事件。
-
-#### 特定组件类型的组件方法
-
-特殊的：不同组件类型可以拥有自己特有的方法，比如 `<web>` 组件支持 `refresh` 方法，详见各组件的描述，在此情况下，我们会产生特定组件类型的 class，比如 `WebElement`，它继承自 `Element`。
-
-如：
-
-> #### `WebElement` <small>继承自 `Element`</small>
->
-> 表示在 Weex 页面中嵌入一个 webview
->
-> **`refresh()`**: 刷新当前 webview
-
-### 只读成员变量或方法
-
-**`ref`, `nextSibling`, `previousSibling`, `parentNode`**
-
-* 继承自 `Node`。
-
-**`nodeType: number`**
-
-* 永远是数字 `1`。
-
-**`type: string`**
-
-* 和构造函数里的 `type` 一致。
-
-**`attr: Object`**
-
-* 当前结点的所有特性的键值对。推荐通过 `setAttr()` 方法进行修改，而不要直接修改这里的对象。
-
-**`style: Object`**
-
-* 当前结点的所有样式的键值对。推荐通过 `setStyle()` 方法进行修改，而不要直接修改这里的对象。
-
-**`event: Object`**
-
-* 当前结点的所有事件绑定。每个事件类型对应一个事件句柄方法。推荐通过 `addEvent()` / `removeEvent()` 方法进行修改，而不要直接修改这里的对象。
-
-**`toJSON(): Object`**
-
-* 返回描述该元素结点的一段 JSON 对象，形如：`{ref: string, type: string, attr: Object, style: Object, event: Array(string), children: Array}`。
-
-## `Comment` 类 <small>继承自 `Node`</small>
-
-### 构造函数
-
-**`new Comment(value: string)`**
-
-### 只读成员变量或方法
-
-**`ref`, `nextSibling`, `previousSibling`, `parentNode`**
-
-* 继承自 `Node`。
-
-**`nodeType: number`**
-
-* 永远是数字 `8`。
-
-**`type: string`**
-
-* 永远是字符串 `'comment'`
-
-**`value: string`**
-
-* 和构造函数里的 `value` 一致。
-
-**`toJSON(): Object`**
-
-* 返回描述该注释结点的一段 JSON 对象，形如：`<!-- value -->`。
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_draft/write-once.en.md
----------------------------------------------------------------------
diff --git a/_draft/write-once.en.md b/_draft/write-once.en.md
deleted file mode 100644
index 673b302..0000000
--- a/_draft/write-once.en.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Write once, Run Everywhere
-type: guide
-order: 4.4
-version: 2.1
----
-
-# Write Once, Run Everywhere
-
-Weex is a "Write Once, Run Everywhere" solution.
-
-* First, Weex is based on web dev experience, which includes syntax and project management.
-* Second, all components & modules in Weex are discussed by iOS, Android, web developers together to ensure it's common enough to satisfy every platforms.
-* You only need write the same Weex code for each platforms.
-
-We think about it in these aspects below:
-
-1. Today for almost all mobile apps, one app solves the same problem in different platforms. Weex hope to supply a lightweight way to describe your business logic which works well in all platforms you need.
-2. For the differences of all mobile platforms, we are willing to fill the gap in 3 points:
- 1. Design the same APIs for all platforms to ensure different platforms have the same business logic description.
- 2. Implement the APIs with different style or behaviors to ensure the implementation and user experience matches different platforms.
- 3. Platforms obviously differ among each other. We also have some environment variables to help developers in certain situations.
-3. We trust (web) standard is the best for all features in all platforms.
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_draft/write-once.md
----------------------------------------------------------------------
diff --git a/_draft/write-once.md b/_draft/write-once.md
deleted file mode 100644
index 6c0c62d..0000000
--- a/_draft/write-once.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-title: 一次撰写，多端运行
-type: wiki
-order: 1.4
-version: 2.1
----
-
-# 一次撰写，多端运行
-
-Weex 提供了多端一致的技术方案。
-
-* 首先 web 开发体验在各端当中是相同的。包括语法设计和工程链路。
-* 其次，Weex 的组件、模块设计都是 iOS、Android、Web 的开发者共同讨论出来的，有一定的通用性和普遍性。
-* Weex 开发同一份代码，可以在不同的端上分别执行，避免了多端的重复研发成本。
-
-我们这样设计基于以下几点设想：
-
-1. 今天绝大多数的移动应用，虽然要同时出现在不同的移动操作系统平台上，但是要解决的问题和用户的需求是相同或非常接近的。Weex 希望提供的是一个快速直接统一描述业务的通用方式，为业务和产品需求直接服务。
-2. 针对各大操作系统平台差异的现状，我们倾向于通过以下两方面来解决这一问题
- 1. 把不同端的样式和行为设计并描述成为相同的 API，这样上层的业务逻辑是同一份，但是在不同端上可以做到不一样的展现效果。
- 2. 通过横向扩展的方式在不同的端上扩展不一样的功能、特性或表现形式。
- 3. 各端不一致的业务描述也是难免的，我们通过提供更多更丰富的环境变量来帮助开发者在同一套代码里高效适配不同的设备场景。
-3. 我们相信标准和规范的力量
-
-部分功能特性由于 native 特性的关系，会略有不同，我们会在相应的组件、模块、API 文档中做相应的描述和提示。
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_drafts/difference-with-web.en.md
----------------------------------------------------------------------
diff --git a/_drafts/difference-with-web.en.md b/_drafts/difference-with-web.en.md
new file mode 100644
index 0000000..2af11f9
--- /dev/null
+++ b/_drafts/difference-with-web.en.md
@@ -0,0 +1,149 @@
+---
+title: Difference with Web
+type: references
+order: 10.1
+version: 2.1
+---
+
+# Differences between using Vue in Web and Weex
+
+## Platform Differences
+
+Vue.js was designed for the Web platform at the begining. Although it can be based on Weex to develop native applications, there are still many differences between web and native. See [Platform Differences Between Weex and Web](../ platform-difference.html) for more details.
+
+Due to those differences, Weex doesn't support those features in Vue.js (mostly are DOM-related):
+
++ Event bubbling and capturing are not supported. Event modifiers, such as `.prevent`,` .capture`, `.stop`,` .self` are meaningless in the native environment.
++ The keyboard event modifiers, like `.{KeyCode | keyAlias}` is also meaningless. (see [docs in Vue.js](https://vuejs.org/v2/guide/events.html#Key-Modifiers))
++ No need to call `vm.$mount` manually, the entry component will mount to the root view of the native container by default.
++ `v-html` and` v-text` directives are not supported.
+
+## Functional differences
+
+### Vue 2.0 Runtime-only build
+
+Vue 2.0 provides two available builds, the standalone build and the runtime-only build. see the [official document](https://vuejs.org/v2/guide/installation.html#Standalone-vs-Runtime-only-Build) for more information.
+
+Weex only required the runtime-only build of Vue 2.0 for better performance and less code size.
+
+The specific differences are:
+
++ The `template` attribute is not supported when defining a component.
++ Does not support using `x-templates`.
++ Does not support using `Vue.compile`.
+
+### Isolate the context of multiple pages
+
+Weex use the "multiple-pages" concept in native, different js bundle will be run in different native views, there context is isolated. Even the `Vue` variable is not the same instance between js bundles. (However, all the js bundle will share the same Weex runtime.)
+
+Based on this feature, the global configurations in `Vue` will only take effect on the current page:
+
++ `Vue.config`
++ `Vue.component`
++ `Vue.directive`
++ `Vue.filter`
++ `Vue.mixin`
++ `Vue.use`
+
+> Note: Those methods are still work, but its effect will be limited to the current page.
+
+## Restrictions in style
+
+CSS is very flexible, has a lot of properties, support a variety of layout modes. This is the advantage of CSS, but also a bottleneck in browser performance optimization.
+
+The style in Weex is parsed by the native renderer, and for the sake of performance and complexity, Weex makes some trade-offs about CSS features to make it better suited to *"best practices"*.
+
+### Single class selector
+
+Weex only supports to use single class name in `<style>`, does not support *type selectors*, *ID selectors*, *attribute selectors*, *adjacent sibling selectors* and the *combinators*.
+
+```CSS
+/* Support single class name selector */
+.one-class {
+ font-size: 36px;
+}
+
+/* Does not support to use combinators between selector */
+.parent > .child {
+ padding-top: 10px;
+}
+.foo + .bar {
+ margin-left: 20px;
+}
+
+/* Does not support attribute selectors. The `v-cloak` directive is not supported */
+[V-cloak] {
+ color: #FF6600;
+}
+```
+
+The restriction is only for the style definition, does not affect the use of class names. You can still use multiple class names on a single tag, such as:
+
+```Html
+<template>
+ <div class="one two three"><div>
+</template>
+```
+
+### Scoped by default
+
+In Weex, For single file components, the styles written in the `<style>` can only be used in the current component.
+
+In order to maintain consistency with Native, it is recommended that you write the style in the `.vue` file with the` scoped` attribute, that is, `<style scoped>`.
+
+### Supported CSS attributes
+
+Weex supports a subset of CSS, and will continue to expand.
+
+Weex supports *box-model* and *flexbox*, as well as other common styles. See [Weex Common Style](../ common-style.html) and [Supported Web Standards](http://weex.apache.org/references/web-standards.html) for more information.
+
+In addition, you should also pay attention to the following points:
+
++ No need to write style prefix.
++ Weex doesn't support `display: none;` and therefore doesn't support the `v-show` directive.
++ In order to optimize the efficiency of CSS parser, Weex doesn't support shorthand attributes, involving the following attributes:
+ + `flex`
+ + `border`, `border-(top|bottom|left|right)`
+ + `margin`
+ + `padding`
+ + `font`
+ + `background`
+
+## Differences in development
+
+Because of the platform difference, you have to compile your source file in two different ways:
+
++ For the web, you can compile source files in any official way, such as Webpack + vue-loader or Browserify + vueify. and require the [weex-vue-render](https://www.npmjs.com/package/weex-vue-render), which is a group of Weex build-in components.
++ For Android and iOS, we've provided [weex-loader](https://github.com/weexteam/weex-loader) to compile the `.vue` files. That is, use Webpack + weex-loader to generate the js bundle that is available for the native.
+
+### Use weex-loader
+
+[weex-loader](https://github.com/weexteam/weex-loader) is a loader for Webpack, see the [official document](http://webpack.github.io/docs/using-loaders.html) to learn how to use it.
+
+One more thing should be reminded is that if the *entry file* of your webpack config is a `.vue` file, you also need to pass an additional ` entry` parameter, usually set to `true`.
+
+```Js
+module.exports = {
+ // Add the entry parameter for the .vue file
+ entry: './path/to/App.vue?entry=true',
+
+ // other configurations ...
+
+ module: {
+ loaders: [{
+
+ // matches the .vue file path that contains the entry parameter
+ test: /\.vue(\?^^]+)?$/,
+ loaders: ['weex-loader']
+ }]
+ },
+}
+```
+
+**You don't need to write those additional parameters if you are using `.js` file as entry file.** We recommend using javascript files as the entry file of webpack config.
+
+### Setup native development environments
+
+Since your are using Weex to develop native apps, setup native development environments, both Android and iOS, would be very useful.
+
+See [Integrating Weex to the existing application](../../guide/integrate-to-your-app.html) for more information.
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_drafts/difference-with-web.md
----------------------------------------------------------------------
diff --git a/_drafts/difference-with-web.md b/_drafts/difference-with-web.md
new file mode 100644
index 0000000..d075312
--- /dev/null
+++ b/_drafts/difference-with-web.md
@@ -0,0 +1,138 @@
+---
+title: Vue.js 在 Weex 中的差异
+type: guide
+group: 高阶特性
+order: 8.3
+version: 2.1
+---
+
+
+# Vue.js 在 Weex 和 Web 中的差异
+
+## 平台差异
+
+Vue.js 最初是为 Web 平台设计的，虽然可以基于 Weex 开发原生应用，但是 Web 开发和原生开发毕竟不同，在功能和开发体验上都有一些差异，这些差异从本质上讲是原生开发平台和 Web 平台之间的差异，可以通过[《Weex 和 Web 平台的差异》](../platform-difference.html)了解更多细节和原因。
+
+由于运行平台存在差异，Weex 不支持 Vue.js 中与 DOM 相关的功能：
+
++ 不支持事件冒泡和捕获机制，`.prevent` 、`.capture` 、`.stop` 、`.self` 等事件修饰符在原生环境中无意义。
++ 键盘事件的 `.{keyCode | keyAlias}` 修饰符在原生环境中无意义。(参考 [Vue 相关文档](https://cn.vuejs.org/v2/guide/events.html#按键修饰符))
++ 无需自行调用 `vm.$mount`，默认会将入口组件挂载到原生应用的视图中。
++ 不支持 `v-html` 和 `v-text` 指令。
+
+## 功能差异
+
+### 仅引入了 Vue Runtime
+
+Vue 除了提供默认的完整包以外，还提供一个更小巧的 `vue.runtime.js`，在这个文件中移除了模板编译的相关操作，Weex 中也仅引入 Vue Runtime 的功能，这样做除了可以减少代码体积以外，还能减少运行期编译模板的负担，提升性能。
+
+具体的差异有：
+
++ 定义组件时不支持使用 `template` 属性。
++ 不支持使用 `x-templates`。
++ 不支持使用 `Vue.compile`。
+
+### 隔离多页面的作用域
+
+Weex 在原生端使用的是“多页”的实现，不同的 js bundle 将会在不同的原生页面中执行；也就是说，不同的 js bundle 之间将不同共享 js 变量。即使是 `Vue` 这个变量，在不同页面中也对应了不同的引用。
+
+基于这个特性，Vue 中全局功能将只在当前页面内生效：
+
++ `Vue.config`
++ `Vue.component`
++ `Vue.directive`
++ `Vue.filter`
++ `Vue.mixin`
++ `Vue.use`
+
+> 注：以上接口的功能并未受影响，只是其生效范围将会限制在同一页面内。
+
+## 样式差异
+
+Web 中的 CSS 非常的灵活，积累了特别多的属性，支持多种布局方法；这是其优势，也是浏览器性能优化的一个瓶颈。
+
+Weex 中的样式是由原生渲染器解析的，出于性能和功能复杂度的考虑，Weex 对 CSS 的特性做了一些取舍，使其更符合最佳实践。
+
+### 单类名选择器和作用域
+
+Weex 中只支持单个类名选择器，不支持关系选择器，也不支持属性选择器。
+
+```css
+/* 支持单个类名选择器 */
+.one-class {
+ font-size: 36px;
+}
+
+/* 不支持关系选择器 */
+.parent > .child {
+ padding-top: 10px;
+}
+
+/* 不支持属性选择器，不支持 `v-cloak` 指令 */
+[v-cloak] {
+ color: #FF6600;
+}
+```
+
+这个只是对样式定义的限制，不影响样式类名的使用，在标签中可以添加多个样式类名，如：
+
+```html
+<template>
+ <div class="one two three"><div>
+</template>
+```
+
+### 组件级别的作用域
+
+在 Weex 中，写在组件 `<style>` 里的样式只能用在当前组件中，默认是 `scoped` 作用域。为了保持和 Native 的一致性，建议在 `.vue` 文件中写样式时，加上 `scoped` 属性，即： `<style scoped>`。
+
+### 支持的样式属性
+
+Weex 支持的样式特性是 CSS 的子集，并且会不断扩充；在实现过程中我们参考了 [CSS 属性在浏览器中的使用频率](https://gist.github.com/Jinjiang/ea6b403036b7287cf8b8508729b77ac0#css-properties)，优先实现其中频率最高的一些属性。
+
+Weex 支持了基本的盒模型和 flexbox 布局，以及其他常用样式，详情可参考[Weex 通用样式文档](../common-style.html)。
+
+在编写样式时，还应该注意一下几点：
+
++ 不需要写样式前缀。
++ Weex 不支持 `display: none;`，因此也不支持 `v-show` 指令。
++ 为了优化样式解析的效率，样式属性暂不支持简写，涉及一下属性：
+ + `border` 、`border-(top|bottom|left|right)`
+ + `margin`
+ + `padding`
+ + `flex`
+
+## 编译环境的差异
+
+在 Weex 中使用 Vue.js ，你所需要关注的运行平台除了 Web 之外还有 Android 和 iOS ，在开发和编译环境上还有一些不同点。针对 Web 和原生平台，将 Vue 项目源文件编译成目标文件，有两种不同的方式：
+
++ 针对 Web 平台，和普通 Vue 2.X 项目一样，可以使用任意官方推荐的方式编译源文件，如 Webpack + vue-loader 或者 Browserify + vueify 。
++ 针对 Android 和 iOS 平台，我们提供了 [weex-loader](https://github.com/weexteam/weex-loader) 工具支持编译 `.vue` 格式的单文件组件；也就是说，目前只能使用 Webpack + weex-loader 来生成原生端可用的 js bundle。
+
+### 使用 weex-loader
+
+weex-loader 是 Webpack 的一个加载器，使用方法参考其[官方文档](http://webpack.github.io/docs/using-loaders.html)。需要提醒的是，如果 Webpack 配置的入口文件是个 `.vue` 格式的文件的话，还需要额外传递 `entry` 参数，通常设置为 `true`，表示将当前组件作为入口组件。为了能正常匹配 `.vue` 文件，Webpack 配置文件中 weex-loader 的匹配规则也需要有所调整。
+
+```js
+module.exports = {
+ // 针对 .vue 文件要添加 entry 参数
+ entry: './path/to/App.vue?entry=true',
+
+ // 其他配置项 ...
+
+ module: {
+ loaders: [{
+
+ // 匹配包含了 entry 参数的 .vue 文件路径
+ test: /\.vue(\?[^?]+)?$/,
+ loaders: ['weex-loader']
+ }]
+ },
+}
+```
+
+如果使用 `.js` 文件作为 Webpack 配置的入口文件，则不需要额外配置这些参数，我们推荐使用 Javascript 文件作为编译的入口文件。
+
+### 搭建原生开发环境
+
+Weex 项目生成的是原生应用，学习一些开发原生应用的基础知识，会对你开发 Weex 项目很有帮助。参考[《集成 Weex 到已有应用》](../../guide/integrate-to-your-app.html)了解更多信息。
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_drafts/native-dom-api.md
----------------------------------------------------------------------
diff --git a/_drafts/native-dom-api.md b/_drafts/native-dom-api.md
new file mode 100644
index 0000000..37729a2
--- /dev/null
+++ b/_drafts/native-dom-api.md
@@ -0,0 +1,212 @@
+---
+title: Native DOM APIs
+type: references
+order: 6
+version: 2.1
+has_chapter_content: true
+---
+
+# Native DOM APIs
+
+Weex in the JS engine, for each page provides a set of Native DOM APIs. This interface is very close to the HTML DOM APIs. Using this interface we can control native rendering logic via JavaScript. And Weex upper layer of Vue 2.0 is based on this interface to adapt.
+
+In most cases, the JS framework will encapsulate native DOM APIs. That way, the developer does not need to work directly on the Native DOM.
+
++ `Document` class: full page document.
++ `Node` class: the base class of nodes.
++ `Element` class: element node, inherited from Node, single view unit.
++ `Comment` class: comment node, inherited from Node, no practical meaning, usually used as placeholders.
+
+Each Weex page has a `weex.document` object, which is an instance of the Document class and is the starting point for all the following interface calls.
+
+Let's take a look at their usage in detail:
+
+## `Document` class
+Each `Document` instance will automatically have a `documentElement` property when it is created. This attribute represents the document node. The document node can have a body, which is the main node of the document.
+
+Note: The document node body only accepts `<div>`, `<list>`, or `<scroller>` three types of element nodes.
+
+### Constructor
+`new Document(id: string, url: string?)`
+
+### Member method
+`createElement(tagName: string, props: Object?): Element`
+
++ Creates an `Element` instance of a specific type `tagName`, which is an element node. Props can contain attr objects and style objects. Such as `createBody ('div', {style: {backgroundColor: '#ffffff'}})`.
+
+`createComment(text: string): Comment`
+
++ Create an instance of ·`Comment`, which is a comment node and set a text description.
+
+`createBody(tagName: string, props: Object?): Element`
+
++ Create a document body node and automatically mount it under `documentElement`.
+
+`fireEvent(el: Element, type: string, e: Object?, domChanges: Object?)`
+Triggers a particular type of event. When the event modifies the DOM's properties or styles during the generation process, the fourth argument is used to describe the changes, and the parameter format is the same as the format of the `createElement` method above.
+
+`destroy()`
+
++ Destroy the current document. Once the document is destroyed, it will no longer work.
+
+### Read-only member variables
+`id: string`
+
++ Each `Document` instance has a unique id. This is also the only id that each Weex page has.
+
+`URL: string?`
+
++ If the current Weex page has a JS bundle URL, the URL will be returned here.
+
+`body: Element`
+
++ The main body of the document, the concept similar to the HTML DOM document.body.
+
+`documentElement: Element`
+
++ Document node, the concept similar to the HTML DOM document.documentElement.
++ The relationship between body and documentElement is: documentElement is the parent of the body.
+
+`getRef(id): Node`
+
++ Get the node based on the node id.
+
+## `Node` Class
+### Constructor
+`new Node()`
+
+### Member method
+`destroy()`
+
+### Read-only member variables or methods
+`ref: string`
+
++ Each `Node` instance has its own unique ref value in the entire `Document instance.
+
+`nextSibling: Node?`
+
+`previousSibling: Node?`
+
+`parentNode: Node?`
+
++ The three interfaces are consistent with the definition of HTML DOM.
+
+`children: Node[]`
+
++ The node has an array of all child nodes.
+
+`pureChildren: Node[]`
+
+The node has an array of all the child elements. The difference between it and `children` is that `pureChildren` contains only the `Element` instance and not the `Comment` instance.
+
+
+## `Element` class, inherited from `Node`
+### Constructor
+`new Element(type: string, props: Object?)`
+
++ Creates an element node of a particular type `type`, and the `props` parameter can contain an `attr` object or a `style` object.
+
+### DOM tree operation
+`appendChild(node: Node)`
+`insertBefore(node: Node, before: Node?)`
+
++ The two interfaces are similar to HTML DOM.
+
+`insertAfter(node: Node, after: Node?)`
+
++ Insert a new node before a child node.
+
+`removeChild(node: Node, preserved: boolean?)`
+
++ Delete the child node node. Parameters `preserved` whether it is immediately removed from memory or temporarily retained.
+
+`clear()`
+
++ Clear all child nodes.
+
+### The DOM property itself operates
+
+`setAttr(key: string, value: string, silent: boolean?)`
+
+`setStyle(key: string, value: string, silent: boolean?)`
+
++ In the above two interfaces, when `silent` is true, the node only updates itself, does not pass the command to the client render layer. This parameter is used to handle user events that have changed the node-related properties at the time of occurrence, and will not send commands repeatedly to the client after the Native DOM has changed.
+
+`addEvent(type: string, handler: Function)`
+
+`removeEvent(type: string)`
+
+`fireEvent(type: string, e: any)`
+
++ Bind events, unbind events, trigger events.
+
+#### Component method for a specific component type
+
+Special: Different component types can have their own unique methods, such as `<web>` components support `refresh` method. You can see the description of each component. In this case, we will generate a specific component type of class, such as `WebElement`, which inherited from `Element`.
+
+Such as:
+
+>`WebElement` inherited from `Element`
+>Indicates that a webview is embedded in the Wex page
+
+>`Refresh ()`: Refreshes the current webview
+
+
+### Read-only member variables or methods
+
+`ref`, `nextSibling`, `previousSibling`, `parentNode`
+
++ Inherited from `Node`.
+
+`nodeType: number`
+
++ The number is always 1.
+
+
+`type: string`
+
++ Consistent with the `type` in the constructor.
+
+`attr: Object`
+
++ The key pair of all the characteristics of the current node. It is recommended to use the `setAttr ()` method to modify, rather than directly modify the object here.
+
+`style: Object`
+
++ The value of all the keys of the current node. It is recommended to modify the `setStyle ()` method, rather than directly modify the object here.
+
+`event: Object`
+
++ All events of the current node are bound. Each event type corresponds to an event handler method. It is recommended to use the `addEvent () / removeEvent ()` method to modify, rather than directly modify the object here.
+
+`toJSON(): Object`
+
++ Returns a JSON object that describes the element's node, such as: `{ref: string, type: string, attr: Object, style: Object, event: Array (string), children: Array}`.
+
+
+## `Comment` class, inherited from `Node`
+
+### Constructor
+`new Comment(value: string)`
+
+### Read-only member variables or methods
+
+`ref`, `nextSibling`, `previousSibling`, `parentNode`
+
++ Inherited from `Node`.
+
+`nodeType: number`
+
++ The number is always 8.
+
+`type: string`
+
++ The type is always `'comment'`
+
+`value: string`
+
++ Consistent with the value in the constructor.
+
+`toJSON(): Object`
+
++ Returns a JSON object describing the annotation node. For example: `<! - value ->`.
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_drafts/timer.cn.md
----------------------------------------------------------------------
diff --git a/_drafts/timer.cn.md b/_drafts/timer.cn.md
new file mode 100644
index 0000000..c93f937
--- /dev/null
+++ b/_drafts/timer.cn.md
@@ -0,0 +1,49 @@
+---
+title: Timer
+type: references
+group: 内置模块
+order: 9.03
+version: 0.10
+---
+
+# Timer
+Weex Timer可以用来延时启动一个一次性任务或者重复任务。Timer会尽最大努力提供精确的延时，但是延时可能并不精确，延时时间很可能会超过用户期望的时间。实际上，timer仅仅是为了支持HTML5中的polyfill，*不建议*开发者直接使用timer.
+
+## API
+Timer中延时的单位是毫秒，且延时时间应该为一个非负的**int**值(int值最大为0x7FFFFF).如果延时时间为零，会将该任务马上插入任务队列的尾部。对于其他非法值，timer的行为未定义。
+
+### setTimeout(fn, timeout)
+`setTimeout()`会等待指定的时间，然后执行给出的函数。
+* 可以使用 `clearTimeout()`去阻止`setTimeout()`运行如果此时对应的`setTimeout()`还没有运行的话。
+* 如果需要重复执行任务，使用`setInterval()`.
+
+#### Arguments
+* `fn` (function): 待执行的函数.
+* `timeout` (number): 执行函数前的等待时间，单位为毫秒。
+
+#### Return value
+一个Number对象, 表示这个任务的id。把id传入clearTimeout(fnId)中可以用来取消任务。
+
+### setInterval(fn, interval)
+`setInterval()`每隔指定的时间间隔后，会执行对应的函数。`setInterval()`不会停止，除非`clearInterval()`被调用。`setInterval()`的返回值可以用来作为`setInterval()`的参数。
+
+#### Arguments
+* `fn` (function): 待执行的函数。
+* `interval` (number): 这次执行函数与下一次函数之间的时间间隔，单位为毫秒。
+
+#### Return value
+一个Number对象，代表任务序列的id。可以把这个值传入`clearInterval`中来终止重复任务的执行。
+
+### clearTimeout(fnId)
+`clearTimeout()`可以用来提前终止`setTimeout()`启动的任务。仅当`setTimeout()`对应的任务没有被执行时，`clearTimeout()`才可以用来终止该任务，否则`clearTimeout()`没有任何效果。
+
+#### Arguments
+* `fnId` (number): `setTimeout()`的返回值.
+
+### clearInterval(fnId)
+ `clearInterval()`可以用来终止 `setInterval()`启动的任务序列。
+
+#### Arguments
+* `fnId` (number): `setInterval()`的返回值
+
+[Try it](http://dotwe.org/vue/ad564965f1eac5a4bc86946ecff70a0c)
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_drafts/timer.md
----------------------------------------------------------------------
diff --git a/_drafts/timer.md b/_drafts/timer.md
new file mode 100644
index 0000000..da518fd
--- /dev/null
+++ b/_drafts/timer.md
@@ -0,0 +1,60 @@
+---
+title: Timer
+type: references
+group: Build-in Modules
+order: 9.03
+version: 0.10
+---
+
+# Timer
+
+Weex encapsulates a series of APIs in order to start/stop a one-time task or a repeated task at a fixed delay. Please note that this module don't provide an accuracy delay. It provides best-effort delivery, but the actual delay may still exceed the delay user wants if the corresponding thread is busy.
+Actually, this module is made for the polyfill of HTML5 timer APIs, developers **should not** use this module directly unless they know exactly what they are doing.
+
+## API
+
+All timeout or interval in this module are measured in milliseconds. Also, timeout and interval should be a non-negative **integer**(the max of integer is 0x7FFFFFFF). The behavior of invalid value for timeout or interval is undefined.
+
+### setTimeout(fn, timeout)
+
+The `setTimeout()` method calls a function after a specified number of milliseconds. Use the `clearTimeout()` method to prevent the function from running. The function is only executed once. If you need to repeat execution, use the `setInterval()` method.
+
+#### Arguments
+
+- `fn` (function): The function that will be executed
+- `timeout` (number): The number of milliseconds to wait before executing the function
+
+#### Return value
+
+A Number, representing the fnId value of the timer that is set. Use this value with the `clearTimeout()` method to cancel the timer.
+
+### setInterval(fn, interval)
+
+The `setInterval()` method calls a function at specified intervals (in milliseconds), and it will continue calling the function until `clearInterval()` is called. The fnId value returned by `setInterval()` is used as the parameter for the `clearInterval()` method.
+
+#### Arguments
+
+- `fn` (function): The function that will be executed
+- `interval` (number): The intervals (in milliseconds) on how often to execute the function
+
+#### Return value
+
+A Number, representing the fnId value of the timer that is set. Use this value with the `clearInterval()` method to cancel the timer
+
+### clearTimeout(fnId)
+
+The `clearTimeout()` method clears a timer set with the `setTimeout()` method. The fnId value returned by `setTimeout()` is used as the parameter for the `clearTimeout()` method. If the function has not already been executed, you will be able to stop the execution by calling the `clearTimeout()` method, otherwise, this method has no influence on the task.
+
+#### Arguments
+
+- `fnId` (number): The fnId value of the timer returned by the `setTimeout()` method
+
+### clearInterval(fnId)
+
+The `clearInterval()` method clears a timer set with the `setInterval()` method. The fnId value returned by `setInterval()` is used as the parameter for the `clearInterval()` method.
+
+#### Arguments
+
+- `fnId` (number): The fnId of the timer returned by the `setInterval()` method
+
+[Try it](http://dotwe.org/vue/ad564965f1eac5a4bc86946ecff70a0c)
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/12e3a8bc/_drafts/v-0.10/advanced/extend-to-android.md
----------------------------------------------------------------------
diff --git a/_drafts/v-0.10/advanced/extend-to-android.md b/_drafts/v-0.10/advanced/extend-to-android.md
new file mode 100644
index 0000000..97bb49e
--- /dev/null
+++ b/_drafts/v-0.10/advanced/extend-to-android.md
@@ -0,0 +1,189 @@
+---
+title: Extend to Android
+type: advanced
+order: 6
+has_chapter_content: true
+version: 0.10
+---
+
+# Extend to Android
+
+### Module extend
+weex sdk support Module extend,
+Weex SDK provides only rendering capabilities, rather than have other capabilities, such as network, picture, and URL redirection. If you want the these features, you need to implement it.
+
+For example: If you want to implement an address jumping function, you can achieve a Module Follow the steps below.
+
+#### Step to customize a module
+
+1. Customize module must extend WXModule
+2. @WXModuleAnno annotation must be added, as it is the only the way to recognized by Weex
+3. The access levels of mehtod must be **public**
+4. The module class also can not be an inner class
+5. Customize can not be obfuscated by tools like ProGuard
+6. Module methods will be invoked in UI thread, do not put time consuming operation there
+7. Weex params can be int, double, float, String, Map, List
+
+Refer to the following example:
+
+```java
+public class WXEventModule extends WXModule{
+
+ private static final String WEEX_CATEGORY="com.taobao.android.intent.category.WEEX";
+
+ @JSMethod
+ public void openURL(String url){
+ //implement your module logic here
+ }
+}
+
+```
+
+#### Register the moulde
+
+```java
+ WXSDKEngine.registerModule("event", WXEventModule.class);
+```
+
+### Use this module in weex DSL
+Now `event` moudle is avaiable in weex, use the module like this:
+
+```javascript
+var event = require('@weex-module/event');
+event.openURL("http://www.github.com");
+```
+
+### Javascript callback
+
+If the module need implement a callback to javascript, you just add `JSCallback` argument to the method you want expose to javascript:
+
+```java
+ @JSMethod
+ public void openURL(String url,JSCallback callback){
+ //implement your module logic here
+ Map<String,Object> resp = new HashMap();
+ resp.put("result","ok");
+ callback.invoke(resp);
+ }
+```
+
+At the javascript side, call the module with javascript function to receive callback data:
+
+```javascript
+event.openURL("http://www.github.com",function(resp){ console.log(resp.result); });
+```
+
+### Component extend
+
+There are label, image, div, scroll, ect. components in weex, you can also customize your own components.
+
+#### Step to customize a component
+
+1. Customize components must extend WXComponent or WXContainer
+2. @WXComponentProp(name=value(value is attr or style of dsl)) for it be recognized by weex SDK.
+3. The access levels of mehtod must be **public**
+4. The component class can not be an inner class
+5. Customize can not be obfuscated by tools like ProGuard
+6. Component methods will be invoked in UI thread, do not put time consuming operation there.
+7. Weex params can be int, double, float, String, Map, List, Array
+
+
+Refer to the following example
+
+```java
+public class MyViewComponent extends WXComponent{
+ public MyViewComponent(WXSDKInstance instance, WXDomObject dom,
+ WXVContainer parent, String instanceId, boolean isLazy)
+ {
+ public MyViewComponent(WXSDKInstance instance, WXDomObject dom,
+ WXVContainer parent, String instanceId, boolean isLazy) {
+ super(instance, dom, parent, instanceId, isLazy);
+ }
+
+ @Override
+ protected void initView() {
+ mHost = new TextView(mContext);
+ }
+ @WXComponentProp(name=WXDomPropConstant.WX_ATTR_VALUE)
+ public void setMyViewValue(String value) {
+ ((TextView)mHost).setText(value);
+ }
+}
+```
+
+#### Register the Component
+
+
+```java
+WXSDKEngine.registerComponent("MyView", MyViewComponent.class);
+```
+
+### Adapter extend
+
+#### ImagedownloadAdapter
+
+Weex SDK has no image download capability, you need to implement `IWXImgLoaderAdapter`. Refer to the following examples.
+
+```java
+public class ImageAdapter implements IWXImgLoaderAdapter {
+
+ private Activity mContext;
+
+ public ImageAdapter(Activity activity) {
+ mContext = activity;
+ }
+
+ @Override
+ public void setImage(final String url, final ImageView view,
+ WXImageQuality quality, WXImageStrategy strategy) {
+ mContext.runOnUiThread(new Runnable() {
+
+ @Override
+ public void run() {
+ if (TextUtils.isEmpty(url)) {
+ view.setImageBitmap(null);
+ return;
+ }
+ String temp = url;
+ if (url.startsWith("//")){
+ temp = "http:" + url;
+ }
+ if (view.getLayoutParams().width<=0 || view.getLayoutParams().height<=0) {
+ return;
+ }
+ Picasso.with(WXEnvironment.getApplication())
+ .load(temp)
+ .resize(view.getLayoutParams().width,
+ view.getLayoutParams().height).into(view);
+ }
+ });
+ }
+}
+```
+
+#### Component Method
+from WeexSDK `0.9.5`, you can define your component method
+
+for example, define a method in component:
+
+```java
+@JSMethod
+public void focus(){
+//method implementation
+}
+```
+
+after your registration for your own custom component, now you can call it in your js file.
+
+```html
+<template>
+ <mycomponent id='mycomponent'></mycomponent>
+</template>
+<script>
+ module.exports = {
+ created: function() {
+ this.$el('mycomponent').focus();
+ }
+ }
+</script>
+```