Everything you care about in one place

Follow feeds: blogs, news, RSS and more. An effortless way to read and digest content of your choice.

Get Feeder

taobaofed.org

Taobao FED | 淘宝前端团队

Get the latest updates from Taobao FED | 淘宝前端团队 directly as they happen.

Follow now 73 followers

Latest posts

Last updated over 2 years ago

Web端H.265播放器研发解密

over 2 years ago

音视频编解码对于前端工程师是一个比较少涉足的领域,涉及到流媒体技术中的文本、图形、图像、音频和视频多种理论知识的学习,才能够应用到具体实践中,本团队在多媒体领域深耕两年多,才算是有一定产出,我们自研web播放器并支持h.265解码,在码率优化的大背景下(保持画质不变情况下,应用图像增强、roi区域检测、智能场景分类和h265编解码等多种技术能力,将码流降低50%。达到减少带宽成本,提升视频服务QoE的目的),真正做到了h265解码播放的全域覆盖。 播放器整体架构我们播放器整体架构设计如下: 本文主要分享了我们基于WebAssembly实现H.265格式的解封装、解码和播放。 背景H.265又称HEVC(全称High Efficiency Video Coding,高效率视频编码),是ITU-T H.264/MPEG-4 AVC标准的继任者。相比H.264,H.265拥有更高的压缩率,也就意味着同样码率(又称比特率是指每秒传送的比特(bit)数。单位为bps(Bit Per Second),比特率越高,每秒传送数据就越多,画质就越清晰),H.265的画质会更清晰,更高的压缩率就能使用更低的存储和传输成本。 带宽成本:在有限带宽下H.265能传输更高质量的网络视频,理论上,H.265最高只需H.264编码的一半带宽即可传输相同质量视频。更低的带宽可以更好的降低存储及传输成本,并为未来基于短视频及直播领域更多更复杂好玩的互动玩法做铺垫。...

淘宝前端团队 2019 年实习生内部推荐通道已开启

over 2 years ago

随着阿里巴巴 2019 年实习生招聘的启动,淘宝前端团队(Taobao FED)实习生内部推荐也已经拉开序幕。这是一个有着十多年历史与荣耀的团队,相信你已经从各个渠道听到过我们的名字。选择一家公司进行实习,对于大学生来说是一个关键的抉择;找到有潜力的实习生进行培养,对于一个团队来说更是求贤若渴。 在这里,请让我向你介绍我的小伙伴们以及我们在做的一些事情。如果你感到有兴趣,并且认为自己足够优秀,不要吝啬你的才华,直接邮件简历给他们,也许他们将会成为你职业生涯的第一个老板,以及你全新人生阶段的良师益友。 他们是前端各个领域的执牛耳者。你可以选择跟随这些业界大牛学习和成长: 从 Node.js 应用框架到全链路监控以及故障演练,从基于 TypeScript 的 IoC...

midway v1.0 社区正式发布 - 面向未来的全栈开发方案

over 51 years ago

midway v1.0 社区正式发布 - 面向未来的全栈开发方案 双旦已过,新年将至,midwayJs 向大家献上贺礼。 之前我们向社区开放了我们的治理工具,也就是 Pandora.js 工具包,用于整个 Node.js 应用的监控和治理,我们承诺这不是结束,只是开源的开始。...

imgcook 体验版发布

over 51 years ago

imgcook 体验版发布经过淘宝前端团队内部近一年半的打磨,imgcook 迎来了社区体验版发布,欢迎试用~。 imgcook 是什么?imgcook 是专注以各种图像(Sketch/PSD/静态图片)为原材料烹饪的匠心大厨,通过智能化手段将各种图像一键生成可维护的 UI 视图代码,期望此 imgcook (图像大厨) 未来能够成为一位 P5...

WebGL 纹理详解

over 51 years ago

WebGL 纹理详解Buffer(数据缓冲区)与 Texture(纹理)是 WebGL 程序的两大数据来源。Buffer 可以通过 ArrayBuffer 或更语义化的 TypedArray 来构造;而 Texture 在大多数情况下,是通过...

前端架构杂思录:议 Function Component 与 Hooks

over 51 years ago

最近团队里 @大果 分享了 React Hooks,也尝试讨论下 Function Component 与 React Hooks,技术的发展路径总是逐步降低其门槛,简单从轻量级角度我们做一个排序: 1createClass Component...

Atag - Web Components 最佳实践

over 51 years ago

引子上一次社区中谈论起 Web Components 已经可以追溯到三四年前了,彼时 Web Components 仍处于不稳定的草案阶段,Polymer 的出世使大家似乎看到了新一代的前端技术,但直到今天,在今年五月 Google I/O 发布 Polymer...

Workbox 3:Service Worker 可以如此简单

over 51 years ago

如果你追求极致的 Web 体验,你一定在站点中使用过 PWA,也一定面临过在编写 Service Worker 代码时的犹豫不决,因为 Service Worker 太重要了,一旦注册在用户的浏览器,全站的请求都会被 Service Worker...

基于 BindingX 的富交互解决方案

over 51 years ago

基于 BindingX 的富交互解决方案BindingX 官网: https://alibaba.github.io/bindingx/BindingX 项目地址: https://github.com/alibaba/bindingx 一. 背景在 Weex 环境下实现一些复杂的手势交互效果可能会产生卡顿,这是因为每次手势交互都会产生两次 JS-native...

活用 Shader,让你的页面更小,更炫,更快

over 51 years ago

可编程着色器(shader)是运行在 GPU 中的程序,是现代图形渲染技术的基础。shader 赋予了开发者「逐像素着色」的能力。桌面/移动设备的图形程序 API 诸如 OpenGL,OpenGL ES,DirectX 以及新一代的 Vulkan,shader 都是重中之重,核心中的核心。 WebGL...

Rax 系列教程(长列表)

over 51 years ago

引子Rax 提供的长列表标签有很多,在什么场景下使用什么列表组件,怎样选择列表组件性能会更好,这些问题可能会给刚接触 Rax 的同学带来困扰。本文结合 Rax 0.5 发布版本对列表能力进行一次详细的梳理。 如何让页面滚动在开始正题之前先说说为什么要有长列表的概念,以及如何让页面可以滚动。 传统的 Web 页面天生在浏览器里就是可以滚动的,我们额外引入一个滚动容器的概念好像比较多余。但当我们做跨容器开发时,这一层概念就变的有意义。native 的页面天生不可滚动,需要借助滚动容器的滚动能力,比如...

G3D —— Hybrid 环境下的 WebGL 3D 渲染引擎

over 51 years ago

G3D 是一款基于 WebGL 的 JavaScript 3D 渲染引擎,借助 GCanvas,G3D 可以运行在 Weex,ReactNative 等 hybrid...