webgl 性能优化的一些方法 1 对于文字过多的场景,可以提前生成0到9以及字符的geometry,同时计算每个字符的宽度。在渲染文字时,分别渲染每个字符,同时通过position.offset 来设置x,y 的偏移
react hooks 学习 1 useRef 与 useState 的区别useRef 和 useState ,生成的变量,在组件的整个生命周期都保存一份,不会在每次render 的时候,重新创建。区别是: state 的改变,会使组件重新渲染,但是ref 的改变,不会引起重新渲染。2 如何获取函数式组件的方法使用forwordRef 和useImperativeHandle 结合,可以定义从父元素传递进来的ref ,可以访问的函数...
源码学习-postcss-pxtransform 这是一个postcss 插件,主要功能是根据不同平台,将css 中的px 单位,转化为rem 或者 rpx;postcss 的主要原理是将css 转换成ast , 然后通过操作ast 的节点,最后将修改后的ast 转换为css . 在原理实现上跟babel 是一样的。既然是修改节点,当然要知道节点的类型有哪些了?h1 {font-family: “Open Sans”, fontstack(“Arial”);}rule: 一个css 规则,包括一个选择器,以及用大括号包含的属性值。如上的一段就是
react 性能优化工具 1 the performance timeline React 15.4.0 引进了一个性能时间线特性让我们可以清晰的排查组件的每一个生命周期的执行时间。在开发者工具performance 中,点击record 记录,然后就可以看到react 的组件生命周期引用方式: href + ?react_perf 比如: http://localhost:8080?react_perf2 why-d
react 学习参考文章 1 componet vs class https://toddmotto.com/react-create-class-versus-component/2 why stateless functional components https://hackernoon.com/react-stateless-functional-components-nine-wins-you-might-ha
React/React Native 的ES5 ES6写法对照表 参考: http://bbs.reactnative.cn/topic/15/react-react-native-%E7%9A%84es5-es6%E5%86%99%E6%B3%95%E5%AF%B9%E7%85%A7%E8%A1%A8
css3 布局 1 transform 如果用3d 形式,书写顺序对结果有影响吗? 有。 参考: http://www.hitthebits.com/2012/06/css3-3d-transforms-function-order.html
函数式编程思想 主要思想,函数是js 的第一等公民,可以作为参数传递,从而实现通过小的、简单的函数,合成复杂的函数例子:for 等可以用map 、reduce 等函数取代函数合成的方法:partical 、 conposite、 curry ,生成复杂的函数参考: http://jrsinclair.com/articles/2016/gentle-introduction-to-fu
js amd commonjs umd 欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来,用它写博客,将会带来全新的体验哦:Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
css3 框架学习 参考: https://pages.18f.gov/frontend/css-coding-styleguide/frameworks/添加一些常用的mixin http://bourbon.io/sass 选择器的书写顺序:variables@extend directives@include directivesdeclaration list (prope
几种浏览器常见的术语 设备像素:screen.width屏幕尺寸: screen.width 单位:设别像素浏览器窗口尺寸: window.innerWidth 单位:css 像素浏览器滚动距离: window.pageXOffset 单位:css 像素文档的尺寸: document.documentElement.offsetWidth事件坐标:pageX 相对于 元素