最近笔者在项目中遇到了 emoji 表情的处理,期间发现 js 处理多字节字符时会有较多坑,记录一下与各位分享。
本文涉及知识点:
Unicode (BMP/SP)
UTF-8 UTF-16 UTF-32 UCS-2
javascript 字符处理
Github 地址:https://github.com/AlloyTeam/AlloyTouch
AlloyTouch 的本质是运动一个数字,把数字的物理变化映射到你想映射的任何属性上。所以带来了广泛的应用场景。不论实在应用、游戏、操作系统等许多层面,监听用户触摸,给用户真实的运动反馈是很常见的应用场景。如王者荣耀里,旋转用户角色,抽奖程序滚动转盘、页面滚动、局部滚动等。
最近笔者在项目中遇到了 emoji 表情的处理,期间发现 js 处理多字节字符时会有较多坑,记录一下与各位分享。
本文涉及知识点:
Unicode (BMP/SP)
UTF-8 UTF-16 UTF-32 UCS-2
javascript 字符处理
最近在 Alloyteam Conf 2016 分享了《使用 RxJS 构建流式前端应用》,会后在线上线下跟大家交流时发现对于 RxJS 的态度呈现出两大类: 有用过的都表达了 RxJS 带来的优雅编码体验,未用过的则反馈太难入门。所以,这里将结合自己对 RxJS 理解,通过 RxJS 的实现原理、基础实现及实例来一步步分析,提供 RxJS 较为全面的指引,感受下使用 RxJS 编码是怎样的体验。
记得以前 facebook 做过一款 HTML5 游戏。开场动画是一块软体类似豆腐的东西一起摇摆。类似的效果如下面的 gif 所示:
facebook 当时使用的是 createjs 下的子项目 easeljs 和 tweenjs 去制作,基于 Canvas 的动画。基本的原理主要是:循环运动 Canvas 抽象的 DisplayObject 的 skewX 和 scaleY 来实现软体摇摆。
目前来看 transformjs 也能做到,因为 transformjs 也能运动 skewX 和 scaleY。先来看看 facebook 的方式。
在过去的两年,越来越多的同事、朋友和其他不认识的童鞋进行移动 web 开发的时候,都使用了 transformjs,所有必要介绍一下,让更多的人受益,提高编程效率,并享受编程乐趣。(当然 transformjs 不仅仅支持移动设备,支持 CSS3 3D Transforms 的浏览器都能正常使用 transformjs)
官方网站:http://alloyteam.github.io/AlloyTouch/transformjs/
Github 地址:https://github.com/AlloyTeam/AlloyTouch/tree/master/transformjs
裁剪图片的应用场景有头像编辑、图像编辑,在移动端要配合手势以及进行触摸反馈来进行变形以确认用户的选区进行裁剪。AlloyCrop 就是专注于裁剪图像的组件,目前服务于 QQ 相关的 Web 业务,今日正式对外开源。
Github 地址:https://github.com/AlloyTeam/AlloyFinger/tree/master/alloy_crop
目前 AlloyFinger 作为腾讯手机 QQ web 手势解决方案,在各大项目中都发挥着作用。
感兴趣的同学可以去 Github 看看:
https://github.com/AlloyTeam/AlloyFinger
在腾讯,如:兴趣部落、QQ 群、QQ 动漫、腾讯学院、TEDxTencent、 AlloyTeam、腾讯 CDC 等多个部门、团队和项目都在使用 AlloyFinger。如下图所示:
目前来看,团队内部前端项目已全面实施组件化开发。组件化的好处太多,如:按需加载、可复用、易维护、可扩展、少挖坑、不改组件代码直接切成服务器端渲染(如 Nuclear 组件化可以做到,大家叫同构)...
怎么做到这么强大的优势,来回忆下以前见过的坑,或者现有项目里的坑。
Copyright © 2011-2021 AlloyTeam. All Rights Reserved. Powered By WordPress
粤ICP备15071938号-2