Li,Weitao luckyadam

IMPORTANT! Remember to check out the wiki page at https://github.com/bebraw/jswiki/wiki/Game-Engines for the most up to date version. There's also a "notes" column in the table but it simply does not fit there... Check out the raw version to see it.

This table contains primarily HTML5 based game engines and frameworks. You might also want to check out the [[Feature Matrix|Game-Engine-Feature-Matrix]], [[Game Resources]] and [[Scene Graphs]].

Name	Size (KB)	License	Type	Unit Tests	Docs	Repository	Notes
Akihabara	453	GPL2, MIT	Classic Repro	no	API	github	Intended for making classic arcade-style games in JS+HTML5
AllBinary Platform	Platform Dependent	AllBinary	2D/2.5D/3D	n

前端一直是个日新月异的领域，作为前端工程师页不再是单单切图、编写页面的岗位。当业务量不断膨胀时我们的代码如何进行有效管理，如何优化我们的开发流程，如何进行性能优化，都是我们需要考虑的问题。通过不断地尝试与学习，我们探索出一套工程化的系统来对这些问题进行解答。同时，基于工程化，实现一套针对项目的资源管理系统，查看项目的资源引用map，而且可以对项目开发到上线过程中的每一步进行跟踪监控，以此来实现对项目的整体把控。

#后端模板方案

优势及挑战

优势

性能优化工作可以更好地开展
前后端分离，减少没必要的沟通成本
数据处理，聚合接口，减少不必要数据
资源加载优化

Athena开发指引

如何加入

代码开源于Github，地址：https://github.com/o2team/athena，目前存在三个分支，master 是主干，也是开发中的分支，production 是用来发布到npm的分支， gh-pages是Athena的主页。

为了保证代码质量，原则上不允许直接提交入master 分支，若需要提交代码，请先Fork本Repo，在本地开发调试无误后提交Pull request，审核没有问题后再合并入主干。

本地开发调试，使用 npm link 命令。首先git clone自己的Fork项目

ITA分享

我们是如何做好前端工程化和静态资源管理

随着互联网的发展，我们的业务也日益变得更加复杂且多样化起来，前端工程师也不再只是做简单的页面开发这么简单，我们需要面对的十分复杂的系统性问题，例如，业务愈来愈复杂，我们要如何清晰地梳理；团队人员愈来愈多，我们要如何更好地进行团队协作；功能愈来愈多，我们要如何保证页面的性能不至于下降，等等。所有的这些都可以归结为如何提升开发体验和性能问题。

1 提升开发体验
- 1.1 规范化
1.2 组件化

	移动端适配方案总结
	===

	> 移动端开发总是存在很多的挑战，兼容性、性能、更高要求的用户体验，都是前端攻城狮需要一一攻破的壁垒。而大屏、高分辨率的手机的出现，又为攻城狮们立下了一个新的制高点，如何适配不同尺寸，不同分辨率的机器，如何在高清分辨率的屏幕上为用户呈现更精致的作品，是前端攻城狮新的挑战。


	### 利用zoom适配

	在进行拍拍小店的开发中我们发现页面在高清分辨率的手机如iPhone6 Plus上表现不尽如人意，有些元素还有文案在这些手机上显示得太小，视觉体验非常不好。咋办类？为了快速解决适配更高分辨率手机的问题，我们天马行空地想到，直接将页面按照一定比例缩放不就好啦，这样在更高分辨率的手机上将页面适当放大，不就能达到适配高清分辨率手机的目的。

	静态资源前置加载系统
	===

	> 性能优化一直是前端工程师探索的课题，而且已经有了很多的经验和手段，但是目前这些优化都是在做一些极致优化，比如优化降低白屏时间几十几百毫秒，性能提升百分之多少，这样的效果从数据上看起来不错，但是用户能感知到的真正提升却很小。如何让用户真正感受到加载的“快”，是本套方案探索的主题。

	## 概述

	为了达到让用户使用时感知到快的目的，我们考虑是否能在某些入口形式的页面主动去加载次级页面的静态资源，以节省用户在浏览这些次级页的白屏时间。这看起来有些trick，但是用户在浏览页面的时候，对于页面来说大部分时间是空闲的，为什么我们不能利用这一部分时间来做些额外的事情呢？

	比如京东的618活动，京东首页是有入口的，而这种活动页面的图片一般会比较多，比较大，用户直接进入的话加载时间肯定会非常久。如果我们在京东首页异步去加载这些资源，利用浏览器缓存缓存到本地的话，用户再去浏览活动页的话加载时间必然会少很多，相当于我们将一部分加载时间进行前置，但由于异步加载的方式，首页的白屏时间并不会减少，用户感知不到资源加载被前置，所以用户感知到的实际加载速度会快很多。

	# 李伟涛

	> 男，1992.01
	> 手机：(+86)186 0021 9827
	> 邮箱：[email protected]
	> Github：[https://github.com/luckyadam](https://github.com/luckyadam)
	> 求职意向：Web前端开发工程师

	## 教育经历

	静态资源前置加载系统一期
	===

	> 梳理一下一期的功能点和Milestone

	## 功能点

	### 静态资源加载脚本

	加载CSS/JavaScript/图片静态资源

	# HTML5 video 相關 #

	## 特性 ##
	HTML `<video>` 元素用於在HTML或者XHTML文檔中嵌入視頻內容。
	HTML5之前，網頁還未有展示視頻的相關標準，視頻只能使用插件（比如flash）來實現網頁中的播放。HTML5的`<video>`標籤為網頁插入視頻提供了官方標準。

	<video src="movie.mp4">
	Your Browser does not support the video tag.
	</video>