2016 年 6 月 16 日

Safari 10 越来越像理想中的浏览器了

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.01.0
  • WebGL
    • iOS 支持情景创建参数 antialias 默认值为 true
    • iOS 支持情景创建参数 alpha,默认值为 false
    • 一个页面上的活动 WebGL 情景数量限制为 16,超出后,新创建情景会将最旧的销毁

媒体

  • iOS 内联视频
    • 设定webkit-playsinline属性后,iPhone Safari会允许视频在页面内播放,没有设置该属性时,点击播放依然会全屏,但用户缩小(双指动作)时,也会内联播放
    • 在 iOS 中,如果视频没有音轨或者禁用了音轨,可以在页面加载时自动播放了
  • macOS 画中画
    • Safari 10 支持画中画功能
    • Safari 默认的 HTML5 视频控制条在画中画中有一个独立的样式
    • 如果想要自定义画中画的播放控制条,可以用 Javascript 演讲模式 API

文本特性

排版与渲染

  • CSS 支持 object-position
    吼,终于支持了,之前只支持object-fit,正好前几天写了一篇 object-fit: 炒鸡方便的图片居中方法
  • 支持使用 SVG 路径剪切
    你可以剪切成复杂的图案,包括贝塞尔曲线路径和evenodd填充规则。使用 path() 图形,就像在 CSS Shapes Level 2 specification 规范中定义的一样
  • 支持 #RGBA 和 #RRGGBBAA
    支持 #RGBA 和 #RRGGBBAA 颜色值了
  • border-image 的新值
    border-image新增 roundspace
  • image-rendering 的新值
    image-rendering 新增两个值 crisp-edgespixelated-webkit-crisp-edges-webkit-optimize-contrast 映射到 crisp-edges
  • 支持 direction 属性
    so... 支持从右到左的语言了,滚动条的位置和表单控制会适配到
  • media query支持广色域

    @media (color-gamut: p3) { … }

  • CSS 截断属性
    新增 break-beforebreak-insidebreak-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

Safari APP 扩展

感觉就是 Chrome Web Store 那一套了。具体看 Safari APP 扩展开发指南

最新文章

  1. 如何找到一家好的北京网站设计公司
  2. 网站后期维护内容有哪些
  3. 网站导航设计的时候要注意哪些
  4. 公司网站制作怎样突出特色
  5. 高质量网站建设的要素有哪些
  6. 想要制作出优质网站需要如何进行策划
  7. 怎么才能让网站的运行速度更快
  8. 网站页面怎样才能设计的更出众
  9. 如何成功应聘网站设计师
  10. 网站制作完成后如何宣传和推广效果更好

最新案例