移动端网站如何做导出功能,哪些网站做科技专题,网站建设平台皆往乐云践新专家,ppt模板下载网更新内容
优化了一下加载速度
图片列表
初步更新了199张图片#xff0c;大部分都有stable diffusion 的prompts。
可以直接复制到AI绘画里面使用。 先来看看效果图吧#xff1a; 我还是挺喜欢这种砌砖流布局 技术点
同样使用了砌墙瀑布流布局:masonry js 安装方法
npm …更新内容
优化了一下加载速度
图片列表
初步更新了199张图片大部分都有stable diffusion 的prompts。
可以直接复制到AI绘画里面使用。 先来看看效果图吧 我还是挺喜欢这种砌砖流布局 技术点
同样使用了砌墙瀑布流布局:masonry js 安装方法
npm install masonry由于我只是浅浅的使用了一下具体使用方法请自行参考github。
react判断有没有滚动到底部useInView
当用户滚动到底部的时候显示转圈圈同时自动加载下一页的数据。
加载完后肯定不是底部了就自动隐藏转圈圈组件。
所以需要useInView这个钩子
ref搭配react的元素property属性使用
const [ref, inView] useInView()
if(inView){//todo 加载下一页数据
}//...html...div ref{ref}/div懒加载lazy load
由于图片详情界面那个模块涉及到图片同时内容以来的组件较多 所以使用懒加载优化一下体验会好一些。
const Component React.lazy(() import(./Component));总结
react上手简单但是优化真的好难逻辑越复杂越难优化。 优化的目的是避免重复渲染组件从而加快渲染速度减轻浏览器的压力。 然而想要重复使用组件就需要考虑很多层面东西最近界面写的差不多了我正在学习useMemo这个钩子用不好就是负优化所以导致很多组件我不敢使用useMemo来优化。还要继续努力
