gpt4 book ai didi

javascript - 如何优化无缝图像网格? CSS 还是 Jquery?图像优化?

转载 作者:行者123 更新时间:2023-11-28 17:01:36 24 4
gpt4 key购买 nike

<分区>

我只是一个简单的用户体验设计师,正在加强他的代码技能,所以请原谅我的无知和蹩脚的代码。

我正在重新启动我的投资组合网站。最初的无缝网格是使用类似 JQuery 插件的 Masonry 构建的。虽然它非常缓慢。 http://jack-a-lope.net/Illustration.html

我决定使用 Masonry 重建它,但担心性能可能仍然很差,所以我找到了一个全 CSS 解决方案,我希望加载速度更快。 https://css-tricks.com/seamless-responsive-photo-grid/

我在另一个网站上寻求帮助,被告知问题不是插件速度慢而是我预加载了 3mb 的图像。我已经调整了我所有图像的大小,并尽我所能优化它们,削减了相当大的内存块,但它仍然加载缓慢。我究竟做错了什么?为什么较大的网站可以加载这么多图像,但这段代码却令人窒息?我还需要做其他事情来优化它吗?仅仅是在页面上粘贴一个加载屏幕还是什么?

[编辑:] 所有图像都已压缩和优化。图像实际上加载得相当快,问题是我得到了一个 FOUC,而 JS 需要时间来重新格式化图像等。

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com