获得徽章 0
正在学习webgl、glsl的前端同学,有以下几款pixel shader工具可以考虑:

1. shadertoy, 老牌pixel shader工具,案例齐全,功能强大,就是网站略卡。

2. shader editor,the book of shader 提供的工具,简洁方便,可以生成在线地址,牛逼之处是能够断点。遗憾的是分享出去全屏打开,效果不忍直视。thebookofshaders.com

3. shadertoy vscode 插件,兼容shadertoy 代码,支持视频、纹理出入,截图,暂停等功能,一切都在vscode中解决,岂不美哉。

4. glsl-doodle,一个开源web component,支持fragment shader链接,方便的将写好的效果直接嵌入前端项目中,如果你要做一个pixel shader作品集展示的话,首选它。

其他pixel 工具不胜枚举,建议初学者使用 shader editor 方便调试。入门同学用glsl-doodle 轻量、便于分享、集成到前端。挑战更高难度入坑 shadertoy。
展开
评论
赞了这篇沸点
有一些小程序云函数绘图的经验想要分享,不知道是否会有人感兴趣。

背景是这样的:产品有导出图片带有自定义字体的需求,小程序canvas组件不支持自定义字体,这时候只能选择服务端渲染图片,然后前端下载图片保存到相册。

其中的坑包括:

1. 云函数中使用node-canvas需要node 8.9+centos 7编译出来的依赖。

2. 文本排版、图片高度动态计算
展开
1
推荐一篇介绍WebAssembly的好文,简单做了摘要:

作者介绍了wasm 能够运行到不同架构系统的原理,通过LLVM IR编译出wasm 虚拟指令集,然后不同平台的wasm的运行时进行编译。

然后对比了c、emcc、rust编译到wasm的过程,最终发现Rust是工具链最友好的,cmcc编译出来的结果带有大量的JS胶水代码,且API不够简洁,C语言编译出来的wasm文件是最小的,因为没有runtime。

最后作者以V8引擎为例介绍了wasm为什么比JS有更好的性能,主要是JS在底层有optimize和deoptimize的过程,编译引擎需要猜测参数类型,而wasm本身就是虚拟指令集,可以直接optimize,无需猜参数类型和deoptimize过程,当然前端的功能的性能也不是wasm直接决定的,最终是否能带来性能上的优化还是要综合对比性能指标,盲目将JS重写为wasm实现也是不明智的。
展开
4
赞了这篇沸点
#今日推特 2019.12.26#

1. 油管原创纪录片《The age of AI 》,主持人小罗伯特唐尼。不提供链接,自己去搜。

2. 春节走亲访友会烦的,在free-for.dev上学点东西打发时间吧。 free-for.dev

3. Vue.js中文官网更新团队近期撰写的安全指南cn.vuejs.org

4. 对于资源特别多需要展示加载动画的网站,设计一个有趣的加载动画可以缓解用户等待焦虑twitter.com
展开
评论
下一页
个人成就
文章被点赞 23
文章被阅读 7,943
掘力值 274
收藏集
7
关注标签
10
加入于