腾讯云
开发者社区
文档
建议反馈
控制台
登录/注册
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
搜索
搜索
关闭
发布
首页
学习
活动
专区
工具
TVP
最新优惠活动
返回腾讯云官网
大史住在大前端
专栏成员
举报
106
文章
136834
阅读量
36
订阅数
订阅专栏
申请加入专栏
全部文章(106)
javascript(23)
编程算法(22)
java(17)
其他(12)
api(12)
自动化(11)
canvas(10)
数据结构(9)
node.js(8)
神经网络(8)
游戏(7)
css(6)
html(6)
http(6)
面向对象编程(6)
angularjs(5)
网站(5)
数据可视化(5)
react(4)
打包(4)
git(4)
渲染(4)
缓存(4)
ide(3)
github(3)
vue.js(2)
json(2)
嵌入式(2)
人工智能(2)
图像处理(2)
express(2)
sass(2)
rxjs(2)
开源(2)
socket编程(2)
https(2)
语音识别(1)
官方文档(1)
tensorflow(1)
php(1)
typescript(1)
android(1)
opengl(1)
composer(1)
linux(1)
unix(1)
视频处理(1)
eslint(1)
webpack(1)
babel.js(1)
容器(1)
koa(1)
lodash(1)
分布式(1)
shell(1)
正则表达式(1)
npm(1)
自动化测试(1)
二叉树(1)
tcp/ip(1)
大数据(1)
安全(1)
windows(1)
系统架构(1)
nat(1)
element ui(1)
bug(1)
编程(1)
编辑器(1)
搜索文章
搜索
搜索
关闭
高性能Web动画和渲染原理系列(2)——渲染管线和CPU渲染
缓存
渲染
canvas
css
动画的流畅程度通常是以FPS(Frame Per Second,每秒帧率)作为衡量的。在摄像机录制视频时每一帧实际上包含了一段时间内的画面记录(长曝光摄影的道理相同的),如果画面里的事物在运动,那么暂停播放时看到的画面通常都是模糊的,这样的画面也被称为“模糊帧”,加上双眼“视觉暂留”效果的影响,影视作品一般只要达到24FPS就可以展示出看起来连续运动的画面;而在页面的渲染中,每一帧都是由计算机计算渲染出来的精确画面,帧和帧之间并不存在模糊过渡,所以通常认为需要达到50FPS~60FPS的帧率,才能够得到较好的观看体验。
大史不说话
2019-10-21
1.5K
0
【带着canvas去流浪(10)】文字烟花
canvas
编程算法
api
首先动画的主框架仍然是我们反复使用的逐帧动画框架,烟花生成以后的部分也不难理解,我们之前已经对物理碰撞进行过仿真,这里实际上就是模拟了带有初速度的自由落体。所以这个小动画里唯一的难点,就是如何根据文字生成烟花,只要做到这一步,其他的部分都比较容易实现。
大史不说话
2019-05-17
915
0
【带着canvas去流浪(9)】粒子动画
canvas
粒子特效一般指密集点阵效果,它并不是canvas独有的,这个名词更多出现在AE,cocos2d,Unity相关的教程中,并且提供了方便的编辑插件让使用者可以轻松地做出例如烟火,流星,光晕等等动态变化的效果,看起来非常酷炫。如果你接触过Three.js,会发现三维空间的点阵效果看起来更生动。粒子特效的本质还是一个逐帧动画,所以我们仍然可以使用上一节中提到的动画编程范式来实现它。本节的教程将实现下面这样一个粒子效果:
大史不说话
2019-05-15
1.4K
0
【带着canvas去流浪(8)】碰撞
canvas
经过前面章节相对枯燥的练习,相信你已经能够上手canvas的原生API了,那么从这一节开始,我们就开始接触点好玩的东西——动画。
大史不说话
2019-05-07
1.1K
0
【带着canvas去流浪(7)】绘制水球图
canvas
api
使用原生canvasAPI绘制水球图,这将是一个非常有意思的挑战任务。水球图是一种常见的加载动画,属于扩展图形,在echarts中使用时需要下载扩展库(同为扩展库的还包括文字云插件和地图插件,项目地址为https://github.com/ecomfe/echarts-liquidfill)。
大史不说话
2019-04-18
1.4K
0
【带着canvas去流浪(6)】绘制雷达图
canvas
使用原生canvasAPI绘制雷达图。(截图以及数据来自于百度Echarts官方示例库【查看示例链接】)。
大史不说话
2019-04-17
812
0
【带着canvas去流浪(4)】绘制散点图
canvas
编程算法
使用原生canvasAPI绘制散点图。(截图以及数据来自于百度Echarts官方示例库【查看示例链接】)。
大史不说话
2019-03-29
1K
0
【带着canvas去流浪】 (3)绘制饼图
canvas
使用原生canvasAPI绘制饼图(南丁格尔玫瑰)。(截图以及数据来自于百度Echarts官方示例库【查看示例链接】)。
大史不说话
2019-03-22
652
0
【带着canvas去流浪】(2)绘制折线图
大数据
canvas
编程算法
使用原生canvasAPI绘制折线图。(柱状图截图来自于百度Echarts官方示例库【查看示例链接】。
大史不说话
2019-03-20
1.2K
0
【带着canvas去流浪】(1)绘制柱状图
canvas
使用原生canvasAPI绘制柱状图。(柱状图截图来自于百度Echarts官方示例库【查看示例链接】)
大史不说话
2019-03-15
1.2K
0
没有更多了
社区活动
【纪录片】中国数据库前世今生
穿越半个世纪,探寻中国数据库50年的发展历程
立即查看
Python精品学习库
代码在线跑,知识轻松学
立即查看
博客搬家 | 分享价值百万资源包
自行/邀约他人一键搬运博客,速成社区影响力并领取好礼
立即体验
技术创作特训营·精选知识专栏
往期视频·千货材料·成员作品 最新动态
立即查看
领券
问题归档
专栏文章
快讯文章归档
关键词归档
开发者手册归档
开发者手册 Section 归档