Safari 10的技术规格出来了,嗯,简直激动人心。
这里简单『搬运』一下官方的文章
Web APIs
- IndexedDB
完整支持W3C推荐规范了 - 复制和剪切
可以用Javascript来复制和剪切内容了,方法:document.execCommand('copy')
document.execCommand('cut')
- CSP 2.0
CSP (Content Security Policy 内容安全策略)支持 2.0 标准了 - Shadow DOM
终于支持了呀,Chrome在几年前就支持了,这样的话,iOS上也可以放心搞 web components 了 - ES 6
嗯,Safari 支持 ECMAScript 2015 标准,也就是 ES 6 ,完全支持,史上第一个完全支持 ES 6 的浏览器 - ES 国际化
集成 ECMAScript Internationalization API 标准,也就是 ECMA-402,支持客户端数字、币种、时间格式等 - DOM 兼容性增强
这个没啥说的 - 3D Touch 事件
对于 3D Touch,iOS 是touchforcechange
, macOS 是webkitmouseforcechange
,只有用力按下时触发。touch
对象的force
属性值的区间为从0.0
到1.0
WebGL
- iOS 支持情景创建参数
antialias
默认值为true
- iOS 支持情景创建参数
alpha
,默认值为false
- 一个页面上的活动 WebGL 情景数量限制为 16,超出后,新创建情景会将最旧的销毁
- iOS 支持情景创建参数
媒体
- iOS 内联视频
- 设定
webkit-playsinline
属性后,iPhone Safari会允许视频在页面内播放,没有设置该属性时,点击播放依然会全屏,但用户缩小(双指动作)时,也会内联播放 - 在 iOS 中,如果视频没有音轨或者禁用了音轨,可以在页面加载时自动播放了
- 设定
- macOS 画中画
- Safari 10 支持画中画功能
- Safari 默认的 HTML5 视频控制条在画中画中有一个独立的样式
- 如果想要自定义画中画的播放控制条,可以用 Javascript 演讲模式 API
文本特性
- 支持 WOFF 2.0,WOFF 2.0改进了字体的压缩效率
- 可以使用 CSS Font Loading Module Level 3 specification规范来从脚本创建和加载字体并跟踪字体的状态
- 只有要渲染的文本的文字在字体的 Unicode range 之内,网络字体才会被下载。
排版与渲染
- CSS 支持
object-position
吼,终于支持了,之前只支持object-fit
,正好前几天写了一篇 object-fit: 炒鸡方便的图片居中方法 - 支持使用 SVG 路径剪切
你可以剪切成复杂的图案,包括贝塞尔曲线路径和evenodd
填充规则。使用path()
图形,就像在 CSS Shapes Level 2 specification 规范中定义的一样 - 支持 #RGBA 和 #RRGGBBAA
支持 #RGBA 和 #RRGGBBAA 颜色值了 border-image
的新值border-image
新增round
和space
值image-rendering
的新值image-rendering
新增两个值crisp-edges
和pixelated
,-webkit-crisp-edges
和-webkit-optimize-contrast
映射到crisp-edges
- 支持
direction
属性
so… 支持从右到左的语言了,滚动条的位置和表单控制会适配到 media query支持广色域
@media (color-gamut: p3) { … }
CSS 截断属性
新增break-before
、break-inside
和break-after
- 去前缀的属性
以下几个属性支持不用-webkit-
的前缀了- filter
- cross-fade
- image-rendering
Web Inspector
- 支持 WebDriver 自动化测试,不多介绍直接看文档吧: Selenium WebDriver
- 内存调试
新的时间轴,可以显示页面的内存使用情况和基于时间的散点分布。这些新功能可以帮你定位和提高页面的内存性能 - 快速抽样分析
呃,这个看不懂。。。直接贴原文:The new JavaScript profiler delivers fast performance by sampling running code at a high resolution while disabling debugging tools. It allows scripts to run at full JIT-accelerated (just-in-time compilation) speeds for accurate timeline recording.
原生 API
- Apple Pay
直接看 ApplePay JS Framework Reference 吧 - WKWebView 的预览动作
更新的 WKWebView API 支持直接在一个自定义的视图控制器中预览一个链接。通过这个 API,你可以在你的 APP 内创建视图而不用弹出 Safari 了,而且你也可以自定义预览的动作。 WKUIDelegate 相关的 Class 有: webView:shouldPreviewElement: 、 webView:previewingViewControllerForElement:defaultActions: 以及 webView:commitPreviewingViewController:. - WKWebView 的
allowsLinkPreview
属性在 iOS 10.0 以后默认为YES
- Safari 视图控制器
iOS 中 Safari 视图控制器支持自定义颜色作为视图的工具栏背景。 - WKWebView 的键盘显示行为
在 iOS 10 中,当键盘被唤起时,WKWebView
对象使用 Safari 原生的行为,会更新它的window.innerHeight
属性,而不再调起resize
事件。
Safari APP 扩展
感觉就是 Chrome Web Store 那一套了。具体看 Safari APP 扩展开发指南