#insiderDevTour
使用最新 Edge 瀏覽器來進行開發
Poy Chang
Developer / Blogger / Father
#insiderDevTour
Poy Chang
目前任職于全美 100 大私人企業,負責企業內部 IT 解決方案設計
與開發,專注於 Azure、.NET Core、Angular 等技術研究
✓ Angular Taiwan 社群核心成員
✓ Microsoft MVP Developer Technologies
✓ 2019 廣州 Global Azure Bootcamp 講師
✓ 2018 臺北 Angular TW Conf 講師
✓ 2018 臺北 Azure Tech Day Party 講師
✓ 2018 台中 .NET Conf 講師
✓ 2018 北京 Global Azure Bootcamp 講師
#insiderDevTour
#insiderDevTour
#insiderDevTour
瀏覽器的 Web 功能不一致,導致相容性問題
Web 開發人員告訴我們什麼?
#insiderDevTour
2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019
#insiderDevTour
瀏覽器的 Web 功能不一致,導致相容性問題
跨操作系統的瀏覽器版本,增加測試和開發成本
Web 開發人員告訴我們什麼?
#insiderDevTour
#insiderDevTour
#insiderDevTour
#insiderDevTour
瀏覽器的 Web 功能不一致,導致相容性問題
跨操作系統的瀏覽器版本,增加測試和開發成本
更新週期長,造成跟不上主流 Web 功能,無法快速錯誤修正
Web 開發人員告訴我們什麼?
#insiderDevTour
#insiderDevTour
Updated daily
#insiderDevTour
瀏覽器的 Web 功能不一致,導致相容性問題
跨操作系統的瀏覽器版本,增加測試和開發成本
較長的更新間隔,造成跟不上主流 Web 功能,又無法快速錯誤修正
Web 應用程式需要靈活性,使用 Web 標準或將 Web 與本機混合使用
Web 開發人員告訴我們什麼?
#insiderDevTour
❌
Windows Web
Applications
Hosted Web
Applications
Progressive Web
Applications
Capabilities via WinRT
1
2
3
✔
#insiderDevTour
Web Standards
Windows Web
Applications
Hosted Web
Applications
Progressive Web
Applications
Capabilities via WinRT
1
2
3
#insiderDevTour
Demo
A preview of Progressive Web Apps in Edge
#insiderDevTour
跨平台的 Web 應用程式
Progressive Web Apps
Preview available
via Dev & Canary Channel
100% web standards based
Discovered and installed via browser
Available across all versions of Windows
Available cross-platform
#insiderDevTour
瀏覽器的 Web 功能不一致,導致相容性問題
跨操作系統的瀏覽器版本,增加測試和開發成本
較長的更新間隔,造成跟不上主流 Web 功能,又無法快速錯誤修正
Web 應用程式需要靈活性,僅使用 Web 標准或將 Web 與本機混合使用
WebViews 需要使用最新的 Web 功能,並提供相容版本的選項
Web 開發人員告訴我們什麼?
#insiderDevTour
使用 WebViews 的原生 App
#insiderDevTour
全新 WebView 控制項
Always up-to-date
Consistent with the browser version
Consistent across all Windows versions
Available across Win32 and UWP apps
#insiderDevTour
全新 WebView 控制項
Bring your own version
Packaged and updated with the app
Consistent across all Windows versions
Available across Win32 and UWP apps
Always up-to-date
Consistent with the browser version
Consistent across all Windows versions
Available across Win32 and UWP apps
(default) (optional)
#insiderDevTour
對於現有的應用程式…
Windows Store based
Web Applications
(WWA, HWA, PWA)
EdgeHTML or MSHTML
based WebView
Other hybrid app types
(Electron, CEF etc.)
…continue to work as-is 🙂
#insiderDevTour
瀏覽器的 Web 功能不一致,導致相容性問題
跨操作系統的瀏覽器版本,增加測試和開發成本
較長的更新間隔,造成跟不上主流 Web 功能,又無法快速錯誤修正
Web 應用程式需要靈活性,僅使用 Web 標准或將 Web 與本機混合使用
WebViews 需要使用最新的 Web 功能,並提供相容版本的選項
開發人員工具應該在所有 Web 內容和平台上保持一致
Web 開發人員告訴我們什麼?
#insiderDevTour
#insiderDevTour
We believe the
evolution of the web
is best served through
standards bodies
1 2 3 4
We will respect the
architectural
requirements and
engineering
approaches used in
Chromium
3
When seeking
improvements in the
web platform, our
default position will be
to contribute
2
We are making this
decision for the long
term
1
#insiderDevTour
#insiderDevTour
微軟自 2018 年 12 月宣布貢獻 Chromium 專案以來,已提交 400 次以上的程式碼貢獻
#insiderDevTour
Working in the open
https://github.com/MicrosoftEdge/
MSEdgeExplainers
#insiderDevTour
讓網路更適合
每一個人
Accessibility Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人 改善 Windows 體驗
跟著網路持續進化
Accessibility Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人
Windows Evolving web
#insiderDevTour
Chromium 62
on Windows 10
Edge 16
on Windows 10
Windows Evolving web
#insiderDevTour
將操作系統級別的高對比度設置,
應用於標準的 Web 內容
Windows Evolving web
https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/master/Accessibility/HighContrast/explainer.md
#insiderDevTour
Windows Evolving web
#insiderDevTour
Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人
Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人 改善 Windows 體驗
跟著網路持續進化
Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人
對無障礙的承諾
改善 Windows 體驗
跟著網路持續進化
Accessibility Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人
對無障礙的承諾
改善 Windows 體驗
Accessibility Windows Evolving web
#insiderDevTour
生物識別的身份驗證技術,引入
Web 以實現無密碼和雙因素身份
驗證
Accessibility Windows Evolving web
#insiderDevTour
Demo
Web Authentication
#insiderDevTour
改進網頁的觸摸板,觸控,鼠標
滾輪,鍵盤和滾動條滾動
Accessibility Windows Evolving web
#insiderDevTour
Accessibility Windows Evolving web
#insiderDevTour
Demo
Scrollbar scrolling
#insiderDevTour
讓網路更適合
每一個人
對無障礙的承諾
改善 Windows 體驗
Accessibility Windows Evolving web
#insiderDevTour
#insiderDevTour
讓網路更適合
每一個人
對無障礙的承諾
改善 Windows 體驗
跟著網路持續進化
Accessibility Windows Evolving web
#insiderDevTour
讓網路更適合
每一個人
對無障礙的承諾
改善 Windows 體驗
跟著網路持續進化
Accessibility Windows Evolving web
#insiderDevTour
與我們分享您在網絡上未滿足的需求的反饋
Windows Evolving webAccessibility
#insiderDevTour
我們的新焦點
一致的平台和工具
使網絡更好
#insiderDevTour
Learn more!
Check out the labs and resources!
aka.ms/insiderdevtour-labs
#insiderDevTour
Insider Dev Tour

使用最新 Edge 瀏覽器來進行開發​