前端资源预加载怎么做

去年夏天，我在公司的一个项目中负责优化页面加载速度。那时候，我们遇到一个常见问题：用户点击某个按钮后，页面需要加载一大堆图片和样式文件，导致页面响应迟缓。
为了解决这个问题，我尝试了资源预加载。具体来说，我使用了标签。记得当时我花了半天时间研究这个标签的用法，最后在部分添加了如下代码：

结果出奇地好，页面响应速度明显提升了。我记得测试数据显示，页面加载时间缩短了大约20%。等等，还有个事，我突然想到，那时候我还调整了网络请求的顺序，把最关键的CSS文件放在了最前面，这样可以让浏览器在渲染页面之前就加载完成样式。
不过，话说回来，前端资源预加载真的有效吗？它对用户体验的影响有多大呢？