NotionNext icon indicating copy to clipboard operation
NotionNext copied to clipboard

【性能问题】最新版本异常卡顿

Open Angel0726 opened this issue 2 years ago • 19 comments

描述bug 简单说明bug的现象、相关的错误提示、日志等 更新之后博客首页能打开https://coolnext.vercel.app/ ,但是所有文章都无法打开。显示404页面 我可以确定的是87e4b2c版本没有问题,但是d3dcb91355c2cc0ac348e353fd286988b2e40d25版本就无法打开具体文章

是不是优化加载出了问题

复现步骤 出现这个bug的操作步骤

期望的正常结果 希望按这个步骤,正常操作结果是什么

截图 相关的页面,应该用结果 image image

环境

  • 操作系统: [例如. iOS, Android, macOS, windows]
  • 浏览器 [例如. chrome, safari, firefox]
  • 版本 [e.g. 22]

补充说明 与问题相关的其它说明

Angel0726 avatar Mar 01 '23 15:03 Angel0726

好像多次刷新之后是可以显示;但是感觉不仅加载速度明显变慢了,而且还卡顿。 博客中的代码是自动换行的,但是notion中的代码不是自动换行的。可以跟notion统一吗 image image

Angel0726 avatar Mar 01 '23 15:03 Angel0726

新问题用手机刷博客,直接卡死,过一会浏览器就报异常。博客标题会雨封面重合 Screenshot_2023-03-02-00-29-36-198_com.android.chrome.jpg

Angel0726 avatar Mar 01 '23 16:03 Angel0726

  • 异常卡顿和404的问题,昨晚有提交了补丁修复,更新后应该会好很多。

  • 修改代码换行逻辑,关闭掉行号显示即可实现和Notion一致:https://github.com/tangly1024/NotionNext/blob/440fcff60e64bfe7668c92275dc17e10c8e960c4/blog.config.js#L62

tangly1024 avatar Mar 02 '23 04:03 tangly1024

  • 异常卡顿和404的问题,昨晚有提交了补丁修复,更新后应该会好很多。

  • 修改代码换行逻辑,关闭掉行号显示即可实现和Notion一致:https://github.com/tangly1024/NotionNext/blob/440fcff60e64bfe7668c92275dc17e10c8e960c4/blog.config.js#L62

代码换行逻辑修改了。更新了昨晚的补丁以后404问题解决了,但是卡顿异常还是存在,感觉不够丝滑 博客网址https://next.zeabur.app/ 可以试一试. 我看了博客使用next主题会很流畅,但是使用hexo主题就会卡顿,不知道是不是hexo主题图片比较多的原因

Angel0726 avatar Mar 02 '23 05:03 Angel0726

  • 建议压缩一下图片大小
  • hexo主题的动画效果,也有可能造成卡顿,我将在新版本中优化此问题

tangly1024 avatar Mar 07 '23 04:03 tangly1024

  • 建议压缩一下图片大小
  • hexo主题的动画效果,也有可能造成卡顿,我将在新版本中优化此问题

更新之后效果有改善,但动画效果需要一些改善。windows、安卓 都存在这个问题 https://jeweled-trilby-556.notion.site/59c95f5032194328a2e7c13c9e25fcf9

Angel0726 avatar Mar 07 '23 07:03 Angel0726

@tangly1024 发现了几个影响性能的地方 这里percent加入依赖数组会导致滚动时频繁地注册和取消事件监听,其他地方也有类似的代码 https://github.com/tangly1024/NotionNext/blob/b22475dec55702fbdff9dc6e7e05188e11e4aeb3/themes/hexo/components/Progress.js#L25-L28

scrollListener里有 clientHeight 等会触发回流的操作,也许应该做个节流,同样也不止一处 https://github.com/tangly1024/NotionNext/blob/b22475dec55702fbdff9dc6e7e05188e11e4aeb3/themes/hexo/LayoutBase.js#L41-L54

ikkz avatar Mar 08 '23 11:03 ikkz

那每次打开一个博客,封面的那个动画卡顿的问题也是因为这个原因吗?

Angel0726 avatar Mar 08 '23 11:03 Angel0726

那每次打开一个博客,封面的那个动画卡顿的问题也是因为这个原因吗?

不确定,我也是刚看到这个项目准备用用

ikkz avatar Mar 08 '23 14:03 ikkz

之前我还一直以为是主题问题,看样子不是。这个用户的butter-fly主题就不卡顿https://www.sszsj.cc/ ,动画换成这个样子会不会好一点,还是说因为图片、网速等问题可能会更糟糕。 这个主题是我翻看issues 705 找到的

Angel0726 avatar Mar 08 '23 15:03 Angel0726

更新3.12之后还会存在卡顿问题。可以参考视频https://jeweled-trilby-556.notion.site/59c95f5032194328a2e7c13c9e25fcf9 版本号中多了一个引号 image

Angel0726 avatar Mar 09 '23 15:03 Angel0726

更新3.12.1之后相比之前有所好转;但还会存在卡顿问题,而且有时候评论区加载不出来,刷新之后才能加载。可以参考视频https://jeweled-trilby-556.notion.site/59c95f5032194328a2e7c13c9e25fcf9 使用设备win、安卓都会卡顿,但是苹果不会卡顿

Angel0726 avatar Mar 10 '23 08:03 Angel0726

更新4e9b9a0之后卡顿依然存在,运行日志。 image

Angel0726 avatar Mar 10 '23 10:03 Angel0726

v3.12.2 版本针对性能做了处理

tangly1024 avatar Mar 11 '23 02:03 tangly1024

还是会卡顿,博客首页卡顿严重。非首页好很多。详情可以看notion链接

Angel0726 avatar Mar 11 '23 02:03 Angel0726

已提交了新的补丁,优化首页动画性能问题

tangly1024 avatar Mar 11 '23 04:03 tangly1024

已提交了新的补丁,优化首页动画性能问题

问题依然存在,详情可以参考notion链接

Angel0726 avatar Mar 11 '23 06:03 Angel0726

卡顿问题完全解决点赞。但是图片加载有一点慢,不知道是不是网络问题。zeabur服务器有一点慢。next.zeabur.app

Angel0726 avatar Mar 12 '23 14:03 Angel0726

更新之后,博客首页每一篇博客高度变小而且高矮不一,是不是没有之前的好看;动画目前是文字飞入,是不是也有没有之前的好看

Angel0726 avatar Mar 13 '23 16:03 Angel0726

更新之后,博客首页每一篇博客高度变小而且高矮不一,是不是没有之前的好看;动画目前是文字飞入,是不是也有没有之前的好看

高矮不一确实不美观,目前已经调整回固定高度了; 动画显然原先的更好看:而处于性能优化的考虑,做成仅文字飞入的效果;出于美观考虑,动画的问题我再优化一下。

tangly1024 avatar Mar 15 '23 01:03 tangly1024