查看详情

The letter of 2018 - Mark Zuckerberg

每年年底小扎都会回顾今年这一年做了什么，2018对于小扎而言无疑是最为挑战的一年，隐私，数据安全，舆情，高管离职，这些问题便随着用户的增长和信息的爆炸膨胀显得非常突出，但是文章还是非常自信的回顾了去年这些方向的努力，大概往往最困难的时候也是厚积薄发的时候。2019，依旧不平静。 原文链接： https://www.facebook.com/zuck/posts/10105865715850211 (自备梯子) For 2018, my personal challenge has been to focus on addressing some of the most important issues facing our community -- whether that's preventing election interference, stopping the spread of hate speech and misinformation, making sure 详情 »

查看详情

iOS 12 静音模式下 AudioContext 无法正常播放的 Bug

最近收到用户反馈，网页的背景音乐播放没有声音。 然后我们就按照正常的流程 Debug 。但是我拿到我的 iPhone 7 测试的时候，但是发现是可以正常播放的，但是 iPhone XS 确没有办法播放。 而且这次非常悬疑的是，iPhone XS 的又是可以正常播放虾米音乐的的歌曲。 此时此刻，宝宝的心情，只能用如下图表示: 随后开始看代码，项目的背景音乐是启用了 AudioContext 。这个时候我们强制设置 AudioContext 的音量来，看下是不是 iPhone XS 的问题； const audioCtx = new AudioContext(); let source = aCtx.createBufferSource(); let buf; const gainNode = aCtx.createGain(); // Create a gainNode reference. gainNode.connect(aCtx.destination); // Add context to gainNode 详情 »

查看详情

聊聊新的 Media API Media Capabilities

关于我们探测是否浏览器能够支持某种视频的播放，我们经常用的 MediaSource.isTypeSupported() 或者 HTMLMediaElement.canPlayType() 来判断，详情可以参看 《探测浏览器对 video 和 audio 的兼容性》 。不过今天介绍一个新的 API , Chrome 在版本 64 开始支持的 navigator.mediaCapabilities；它解决的问题是我们支持了这些格式，但是在当前设备那种格式表现最好呢？ Media Capabilities 在 wicg 组的草案中明确描述了: This specification intends to provide APIs to allow websites to make an optimal decision when picking media content for the user. The APIs will expose information about 详情 »

查看详情

十一月

嗯 不知不觉已经是十一月底，离2018年结束也就那么一个月了。 ​ 匆匆忙忙​ ​ 十一月份，匆匆忙忙就过去了，似乎仔细回想都留不下什么。今日相声老艺术家常贵田去世，大概今年一个关键词，就是离别。目送了很多老艺术家离开，岁月其实挺无情的，有的没能跑赢时间，有的没能跑赢病痛，想想，这一年，自己是跑赢还是落下了，也只有自己知道～ 开开心心 大概在完成今年最重要的一个目标后，发现父母开心了不少。我也不知道是那个时候执拗，还是现在稍微成熟后，学会了理解。爷爷做完心脏手术后一年后的体检，各项指标恢复正常。家里门店终于要准备拆了，重新建楼，大概过不了几个月，面对曾经的旧房子，面对接近30多年的地方，换了样子，心里也不知觉会有些伤感。但是这也意味着，父母也会做出调整，也算辛苦一辈子，终于可以休闲的去迎接未来的日子。记得90年代生意刚开张的时候，那个时候还是木门，每次赶场，门店挤满了，开心的是自己还小，似乎什么也不用管。新千年后，门店第一次装修，换上了卷帘门，装上了挡雨棚，每到春节，还可以在路边摆摊，分流，租借了对面的口面，于是乎，那十几年，最讨厌春节前几天，起早抹黑的干活，很累， 详情 »

查看详情

AV1 VS HEVC VS VP9

之前写了关于 Web 对 H.265/HEVC 的播放支持，如果有兴趣的童鞋可以前往 《Web 播放 H.265视频》 了解，今天主要介绍 AV1(AOMedia Video 1) 和 H.265 的对比。 H.265/HEVC H.264 的成功，导致开发组开始尝试新的编码优化，H.265/HEVC 的编码架构大致上和H.264/AVC的架构相似, 而 H.265 的编码单位可以选择从最小的 8x8 到最大的 64x64， 同时，H.265的帧内预测模式支持33种方向（H.264只支持8种），并且提供了更好的运动补偿处理和矢量预测方法。反复的质量比较测试已经表明，在相同的图象质量下，相比于H.264，通过H.265编码的视频大小将减少大约 39-44% 。而 详情 »

查看详情

使用 Chrome 原生 lazyload 属性进行图片懒加载

在最近的 《Chrome Dev Summit - Key Techniques for Fast Websites》 ，Chrome 团队的成员介绍了，原生的 lazyload 属性即将登陆 Chrome。 一听到 lazyload ，大家可能印象最深的是就是早期瀑布流 Pinterest 网站的的加载效果。效果如下; 实现效果可以参考很早之前写的关于图片的 placeholder《实现类似Pinterest 的图片预加载功能》。这是我们需要通过 JS 来进行一些图片的加载和替换。很开心，Chrome 给了大家尝鲜这个属性的机会，我们在 W3C 的草案中，很早就可以看到对于这个属性的定义; The lazyload attribute is a boolean and IDL attribute that indicates the priority order in which the User Agent should 详情 »

查看详情

VeeR VR 长期招聘贴

About VeeR/关于我们 我们是全球增长最快的 VR 内容分享社区。2016年6月，获得顶级VC天使投资。10月，VeeR VR 正式上线，并于圣诞之际用户突破百万大关，跃居美国总榜前25，娱乐/视频榜前5。2017年初，VeeR创作者和原创内容数量覆盖160个国家地区，跃居全球同类第一，并完成A轮融资。VeeR VR是国内唯一获得Google Daydream, HTC Vive, Oculus Rift, App Store 首页推荐的 VR 类 App。 我们是一个由极客和艺术家组成的全球化创业团队，创始团队成员来自上海交大、北京大学、清华大学、Stanford University、UC Berkeley、CMU，Twitter、Facebook、Coursera和国内一线互联网公司, 我们期待你的到来，和我们一起在VR软硬件天时地利的中国共同创造第一家VR领域的独角兽公司！ Position/在招职位 数据工程师 后端工程师 Unity工程师 Android实习生 招聘详情 Contact/联系方式 详情 »

随笔-20181011

昨日双十一，买了些东西。其实印象最深的还是视频里马老师说双十一是感恩的日子。 感恩的日子，感恩这些快递小哥，感恩我们的父母，感恩身边的朋友，感恩我们的老板，毕竟买买买的钱是他们发的。双十一现在越来越成为很多人一个放松购物的日子，听说买东西令人舒适。 其实还是想强调这句话: 因为相信，所以看见 这个世界我们不能缺失对于未来美好的期待，无论现在怎样，因为相信，所以我们才去行动！ 详情 »

查看详情

【译】Netflix 网页性能优化案例

原文地址： https://medium.com/dev-channel/a-netflix-web-performance-case-study-c0bcde26a9d9 由于自己最近一年半的事件都在做视频页面相关的，而且这次 Netflix 的技术栈也与我们相似，因此翻译这篇文章，希望大家一起学习。页面很多细节值得深入，但是整个分析下来其实给我们自己在做页面优化提供基本的思路。 Netflix 目前是全球非常非常出色的流媒体服务网站。自从 2016 年发布之后，Netflix 发现用户不仅会在移动端设注册，也会在 Web 上完成注册相关。 通过优化登出页面使用的 JavaScript 代码，以及 prefetching， 开发者给用户提供了更好的体验，以及多个方向的改善: 加载以及可交互时间 (Time-to-Interactive) 缩短了 50%; JS Bundle 的体积减小了 200 KB ，他们选择在客户端更为纯粹的 JS 库，但是服务端依旧选择 React 来渲染； 通过 Prefetching 一些 CSS 和 JS ，缩短了 30% 的可交互时间在跳转的其他页面的时候。 通过削减 详情 »

查看详情

Web 播放 H.265视频

本文主要从H.265 编码格式出发，介绍 H265 使用情况，以及对比 H.264的优势，随后分析如何在前端完成 H265 视频格式的播放。 H.265, HEVC 是当前非常火的视频压缩方式，相对于大家熟知的 H.264 ，平均可以带来接近于 50% 的宽度节省。这对于我们做视频的开发者而言，无疑我们可以在同等流量下拿到更多的 Buffer,无论是直播还是视频播放都是非常有收益的事情。 HEVC (H.265) Vs. AVC (H.264) H.265/HEVC的编码架构大致上和H.264/AVC的架构相似, 主要也包含，帧内预测（intra prediction）、帧间预测（inter prediction）、转换（transform）、量化（quantization）、去区块滤波器（deblocking filter）、熵编码（entropy coding）等模块。 详情 »