分类:Web开发

小火车是怎么跑起来的

作者: 叶斋 发表于: 2015-12-29
前言 淘宝玩法平台 由淘宝 FED 团队互动小组开发和维护,是一款为运营/视觉同学提供自主搭建/定制游戏玩法服务的平台,平台提供丰富的游戏模板,和超级可定制能力,分分钟就可自己搭建出个性十足的游戏玩法。 淘宝玩法平台的版头动画,是由我们的视觉设计师 @鲍龙 设计,由我实现的。 点击 De...

WebGL 技术储备指南

作者: 叶斋 发表于: 2015-12-22
WebGL 是 HTML 5 草案的一部分,可以驱动 Canvas 渲染三维场景。WebGL 虽然还未有广泛应用,但极具潜力和想象空间。本文是我学习 WebGL 时梳理知识脉络的产物,花点时间整理出来与大家分享。 示例 WebGL 很酷,有以下 demos 为证: 寻找奥兹国 赛车游戏 划船...

Velocity New York 2015 - 前端篇

作者: 海文 发表于: 2015-12-15
这是一篇迟到的总结。2015 年 10 月有幸代表淘宝前端参加了 Velocity New York 性能大会,回来后马不停蹄的忙完双十一、双十二两个大促,终于有时间完成这篇总结。阿里每年都会参加将近 30 场国外会议,和前端相关的主要就是 Velocity(纽约)和 QCon(旧金山)了。这...

Math.random() 二三事

作者: 一位 发表于: 2015-12-08
随机数 随机数是统计学领域的一个重要概念,对于游戏来说同样意义非凡,用好随机数,可以使你的游戏更真实、更人性、富有魅力。 举例子来说:一个打靶游戏,子弹每次都命中准心所示位置是不科学的,加上抖动误差,会使真实感更加强烈;再如,抽奖大转盘程序,每当转盘停止转动时,指针恰好都指向奖品图片的正中点,...

骨骼动画原理与前端实现浅谈

作者: 叶斋 发表于: 2015-12-01
人的运动——走,跑,跳,是由骨骼带动躯干和四肢完成的。「骨骼动画」,顾名思义,就是模拟骨骼运动的机制而制作的动画。比如下面这条奔跑的小龙。参考 Demo。 素材来自开源骨骼动画编辑器 Dragonbones 用到的素材,额,其实是他大卸八块后的样子。 骨骼动画主要被用游戏场景中,做 Log...

记一次淘宝首页奇葩的渲染问题

作者: 阎王 发表于: 2015-11-24
或许你曾经在 Chrome 浏览器上碰到过这样让人瞠目结舌的问题: hover 触发一个层展示,hover 离开后,这个层还遗留残影 浏览器没有清理一个元素渲染的上一个状态,导致页面多出一个错位的跟该元素一模一样的影子 交互时突然出现一个方形色块,覆盖在元素上 或者还有更奇葩的…… 以上列...

ES7 Decorator 装饰者模式

作者: 玄农 发表于: 2015-11-17
1、装饰模式 设计模式大家都有了解,网上有很多系列教程。 这里只分享 装饰者模式 以及如何使用 ES7 的 decorator 概念。 1.1、装饰模式 v.s. 适配器模式 装饰模式和适配器模式都是 包装模式 (Wrapper Pattern),它们都是通过封装其他对象达到设计的目的的,但...

如何评价页面的性能

作者: 溪夏 发表于: 2015-11-10
引言 前端页面的性能一直都是一个热议的话题,从老早的“军规”开始我们就一直在关注页面的性能问题。 在前面巨人们的身后每个人也有自己的一些页面性能的经验,本文主要是介绍如何评估页面加载完成之后的性能。 浏览器如何渲染一个页面 先附上一张图片: 这是在网上找的一张图,虽然是用来描述 perfo...

已买到的宝贝前端组件化探索

作者: 梧忌 发表于: 2015-11-03
随着已买到的宝贝组件化全网回归完成,项目开发工作终于告一段落了,接下来便是 Beta ,灰度发布。我也终于有了时间来总结一下整个项目。 同学们普遍对 PC 业务如何进行组件化感兴趣,在此就把我在项目中的思考过程,积累的经验写出来与大家分享。 先来介绍一下已买到的宝贝这个业务: 已买到的宝贝是全...

淘宝首页兜底容灾方案

作者: 阎王 发表于: 2015-10-29
淘宝首页是淘宝的一个大流量入口,平均每天的 PV 量达到一亿。而页面上的数据很多都是通过接口调用,不同的接口对应着不同的系统,每个系统的稳定性是不太一样的。 一、兜底容灾的必要性 一个日均承载一亿流量的网页,会经常出现哪些问题呢? 某个接口挂了,前端拿不到数据或者拿到的数据不够,页面展示就...