刀耕火种

 

TAT.dnt 移动 web 开发调试工具 AlloyLever 介绍
In Web开发 on 2016年05月10日 by view: 8,760
8

简介

web 调试有几个非常频繁的刚需:看 log、看 error、看 AJAX 发包与回包。其他的如 timeline 和 cookie 以及 localstorage 就不是那么频繁,但是 AlloyLever 都支持。如你所见:

 

写在前面

因为 zepto、jQuery2.x.x 和 Nuclear 都是为现代浏览器而出现,不兼容 IE8,适合现代浏览器的 web 开发或者移动 web/hybrid 开发。每个框架类库被大量用户大规模使用都说明其戳中了开发者的刚需。本文将对比 zepto/jQuery 到 Nuclear 的设计和演化的过程。

无框架时代

互联网的春风刚刮来的时候,人们当时利用三剑客制作网页。

TAT.dnt web 里计算 FPS[译]
In Web开发 on 2015年10月23日 by view: 3,433
1

帧率(FPS)用于描述成像装置产生连续图像的频率 动画其实就是显示连续帧产生的错觉。如果 FPS 太低,动画将不平滑,甚至人眼都能看到每一帧图像。 一般运动图像的帧率为 24 FPS, 电视使用 30 FPS。在现代游戏中,玩家必须在视觉跟踪动画对象 ,并迅速作出反应,帧速率一般是每秒 30 帧和 60 帧之间。然而,快速移动的物体,可能需要更高的帧速率 ,以避免不希望的视觉假象(闪现)。虽然从理论上讲,我们可以达到极高的帧速率,在 FPS 由显示器的刷新速率的限制 。现代的液晶电视能 120 FPS,甚至 240 FPS。在手机,显示器是最有可能限制为 60 FPS。

TAT.dnt 折线转曲线
In Web开发 on 2015年08月25日 by view: 3,350
3

写在前面

这个东西其实是有价值的东西。因为在软体模拟、数学方程可视化、流体模拟、数据可视化等等方面都有其用武之地。

如水的模拟:

usage

 

TAT.dnt Nuclear 开始
In Web开发 on 2015年07月12日 by view: 2,023
6

为什么 Nuclear

这里列举 Nuclear 在竞品中的优势:

  • 借助浏览器本身的机制,无任何代码约定和入侵
  • 放心使用 HTML+CSS+JS
  • observejs 替代 EventLoop、requestAnimationFrame、Ticker 等定时循环
  • 解决 MV*无法构建复杂特效的难题,随意构建超复杂交互特效,自由地大展拳脚
  • 支持 Dom 和 Canvas 组件,未来支持 SVG 和 WebGL.
  • SVG 库 Sword 已经整装待发:https://github.com/AlloyTeam/Sword
  • WebGL 库 pixeljs 正在全力推进 https://github.com/kmdjs/pixeljs
TAT.dnt lambda.js
In Web开发 on 2015年06月25日 by view: 1,822
0

lambda.js 的由来

作为一个当耐特程序员,对 lambda 一定不陌生。随着当耐特版本的更新迭代,C#也由委托==〉 匿名委托==〉lambda 表达式。由于 javascript 语言的约束,没有提供相应的 lambda 的机制,所以就有了 lambda.js,让广大 jser 也可以 (a,b)=>a.xx==”yyy”&&b>11 一把!

Query Operator

而 lambda 最常用的地方就是 Query Operator。

比如下面一些 C# code:

TAT.dnt AlloyRenderingEngine 燃烧的进度条
In Web开发 on 2015年05月25日 by view: 3,394
0

写在前面

Github: https://github.com/AlloyTeam/AlloyGameEngine

HTML 5 新增了 progress 标签,那么再去使用 AlloyRenderingEngine 去模拟进度条是否多余?
不多余。有四大好处:

  • 样式更加灵活 (想怎么绘制就怎么绘制)
  • 跨平台跨浏览器样式更加统一(使用便签,各个浏览器默认样式是五花八门)
  • 效果更加酷炫,(比如燃烧的进度条= =!)
  • 像素能够统一管理

统一像素管理的好处:

  • 更容易的全尺寸缩小和放大(最常见的:全屏游戏)
  • 缩小和放大不用操心内部元素错位(只是交给浏览器去进行插值运算)
  • 更好的滤镜控制(如游戏中死亡画面,全屏黑白化)
  • 更好的移植性和跨平台性(opengl<->canvas2d<->webgl<->opengl 等等各种 mapping)
TAT.dnt AlloyRenderingEngine 文本框组件
In Web开发 on 2015年05月20日 by view: 4,254
7

写在前面

Github: https://github.com/AlloyTeam/AlloyGameEngine

在 dom 元素里,自带了 input 标签,设置其 type 为 text,它就是一个文本框。

那么在 Canvas 中模拟 input 文本框是不是闲的没事找事?绝对不是!
因为在游戏当中可以统一化像素管理,具体统一化像素管理有什么好处,以后新开文章详细讨论。