本節書摘來自異步社群《html5實戰》一書中的第1章，第1.4節，作者： 【美】rob crowther , joe lennon , ash blue , grey wanish 更多章節内容可以通路雲栖社群“異步社群”公衆号檢視。
如前所述，html5技術并不僅限于html5規範本身，還有大量的其他技術和規範，定義了很多新的功能。現在，很多浏覽器廠商都在他們最新版的産品中穩步實作着這些功能，這其中包括地理定位api、indexdb api、檔案閱讀器、檔案編輯器、file system api，以及svg和webgl。
本節主要學習内容
地理定位api及其使用方法。
indexdb api，以及如何利用它在用戶端建構資料庫。
面向檔案的規範，以及如何利用它将檔案儲存在使用者的本地檔案系統中。
svg和webgl，以及如何利用它們在web中建立高品質的矢量圖形和3d動畫。
下面我們就來介紹這些規範，它們雖然是輔助性質的，但作用同樣也很重要。先從地理定位api開始。
1.4.1 地理定位api（geolocation api）
随着近年來移動裝置的大量湧現，地理定位應用也多了起來。現代的智能手機上攜帶的全球定位系統（gps）傳感器能夠非常精确地定位使用者的地理位置。即使gps不可用（如移動裝置并不具有gps傳感器，或者使用者不在衛星的掃描範圍内），移動裝置還可以轉而使用其他的位置跟蹤方法，如利用蜂窩網絡信号、wi-fi信号或ip位址。
地理定位api中定義的方法能使web應用确定使用者的地理位置。當調用這些方法時，浏覽器就會通知使用者，應用正在請求通路他們的位置。使用者可以選擇接受或拒絕這種請求，進而確定應用不會未經許可就跟蹤他們的位置。如果使用者接受了請求，地理定位api就會向應用送出一系列有關使用者位置的資料，其中包括了使用者的地理坐标位置（經緯度）、海拔高度、航向、速度，以及結果的精确度等資訊。
第3章會介紹有關地理定位api的内容，屆時你将學會如何擷取使用者地理位置并在html文檔中嵌入地圖，如圖1-15所示。
https://yqfile.alicdn.com/fb51e89bb1115f82ff414f26274ba2aee6e1d3b7.png
" >
圖1-15 在第3章開發的應用中，加入了能反映使用者目前位置的地圖
1.4.2 索引資料庫api（indexeddb api）
indexeddb api可以讓開發者把複雜資料結構存放在完整的用戶端資料庫中。與web storage api相比，indexeddb api的重大改進在于：在web storage api中，唯一的索引是鍵/值對的鍵，而在indexeddb api中，值也完全可以被索引了。進而為需要搜尋或過濾資料的應用提供了一種比較可行的解決方案。不過，indexeddb api更為複雜，一開始很難掌握。
indexeddb是html5家族中相對較新的成員。除了它之外，還有另外一種被人們推薦的解決方案，web sql（結構化查詢語言）。這種規範定義了一種用戶端關系型資料庫，使用sql聲明來查詢并操控資料。可最後這個規範還是被遺棄了，因為所有采用這種規範的浏覽器都用的是同一種實作（一種sqlite資料庫），而這種情況就違反了whatwg及w3c的标準化政策：每種特性必須有兩種獨立的、可互操作的實作。盡管該規範被遺棄，但一些浏覽器還是保留了對它的支援，這其中就有移動safari和android上的一些移動浏覽器。目前，浏覽器對indexeddb的支援遲緩不前，是以多數使用indexeddb的web應用同時也把web sql當做一個回退方案。
在第5章，你将學會如何在任務管理應用中使用indexeddb（以及web sql回退方案）存儲任務資料，如圖1-16所示。
https://yqfile.alicdn.com/b91caed41bc22832b5d6ede2c441431075fcacd4.png" >
圖像說明文字
圖1-16 第5章開發的應用将使用indexdb來存儲一系列任務，并允許快速排序與搜尋
1.4.3 檔案api、檔案閱讀器api、檔案編輯器api與檔案系統api
在web應用中處理檔案向來是個難題。唯一能讓使用者選擇本地計算機檔案的原生方法是使用檔案輸入類型，而這也非常麻煩，特别當遇到調整web小部件的ui樣式時，情況尤其如此。當使用者選擇檔案時，應用不得不把整個檔案都上傳到伺服器端，以便進行處理。雖然可以利用基于flash和java的方案來實作更好的功能，但由于需要安裝第三方插件，是以也不算是理想的解決方案。
html5家族包括了一些與檔案有關的規範，試圖在web應用中将檔案操作變得簡單。file api可以讓開發者用javascript擷取一個檔案對象的引用，讀取一些屬性，如名稱、大小以及mime類型等。可以用檔案閱讀器（file reader）api來讀取檔案對象，既能夠整體讀取也能部分讀取。同樣，也能用檔案編輯器（file writer）api将資料輸出為檔案。檔案系統（file system）api能讓開發者在用戶端的沙盒封裝化的本地檔案系統中操縱檔案對象。這就能把很多與檔案相關的互動都放在用戶端執行，極大地節省了伺服器端的加載時間。過去，把整個檔案都上傳到伺服器端，僅僅因為發現錯誤的mime類型，就不得不通知使用者檔案類型不正确。可想而知，當使用者上傳完一個大檔案後，這樣處理是多麼糟糕，而我們現在再也不需要這樣做了。
你可以使用所有的api來提供一個完整的本地檔案系統。第3章将介紹html檔案到底存在何處。圖1-17展示出應該如何使用一些功能。
圖1-17 第3章所建立的super html5編輯器可以實作多種檔案操作，比如建立新的空白檔案，
導入已有檔案（通過選擇或拖動導入）等。該編輯器将把檔案儲存在一個沙盒封裝的本地
檔案系統中。在該檔案系統中，可以檢視、編輯、删除檔案，或者通
過拖放操作，将檔案從應用導出到計算機中
1.4.4 可伸縮矢量圖形
可伸縮矢量圖形（scalable vector graphics，svg）是一種xml語言，它可以讓你使用html标記來建立效果驚人的矢量圖形，不僅可以利用css進行樣式編排，并且還能使用javascript借助dom元素進行互動。位圖圖形的一個主要問題在于，按比例放大其尺寸後，圖像品質會降級，産生“像素化”效果。矢量圖形則是基于數學公式建構而成，而非由一個個像素點構成，是以即使放大後也能看起來十分美觀。
在第7章中，我們将建立一個叫做svg aliens的遊戲（如圖1-18所示），學習如何使用svg來建立一些形狀及複雜對象，實作碰撞偵測，了解svg相比于canvas元素的優缺點。
https://yqfile.alicdn.com/3fe80f76da8d0b6cbcbf9dc79c2d3a0255f82a98.png" >
圖1-18 svg aliens遊戲的畫面。本書後面章節講述如何完整地開發這個遊戲
1.4.5 web graphics library
最後再介紹一下web graphics library（webgl），這是一個利用canvas元素來建立3d圖形的javascript api。它基于open graphics library for embedded systems（opengl es）标準，這項标準針對包括手機在内的嵌入式裝置而設計了一套3d現實方案。借由它所提供的api，開發者可以使用着色器（shader）、緩沖以及繪圖方法來實作圖形硬體底層控制。
在第9章，我們将學習webgl api與3d圖形程式設計，通過建立一個簡單的全3d遊戲geometry destroyer，來了解建立shader，利用緩沖來處理資料，以及通過矩陣運算将3d資料轉變為螢幕上的圖形等内容。該遊戲畫面如圖1-19所示。