个人网站介绍 欢迎来到我的个人网站！在这里，你可以了解到我的兴趣爱好、工作经历以及正在进行的项目。我会定期更新这个网站，以便你能及时了解我的最新动态。
技术栈
这个网站主要使用了以下技术：
- HTML/CSS:用于构建网站的页面结构和样式。
- JavaScript:用于实现网页的交互功能，如懒加载图片等。
- React.js:用于构建用户界面的JavaScript库。
- GitHub Pages:用于托管和部署网站的平台。
懒加载图片
为了提高网站的加载速度，我使用了lazysizes库来实现图片的懒加载。当图片进入可视区域时，它们才会被加载，从而减少了页面的初始加载时间。
/* @see https://github.com/aFarkas/lazysizes#broken-image-symbol */
.js img.lazyload:not([src]) { visibility: hidden; }
/* @see https://github.com/aFarkas/lazysizes#automatically-setting-the-sizes-attribute */
.js img.lazyloaded[da] { width: auto; height: auto; max-width: 100%; max-height: 100%; }
在这段代码中，我们为img元素添加了.lazyload类，并设置了visibility: hidden;属性。当图片进入可视区域时，它们的可见性将被移除，从而实现懒加载。同时，我们还为已经加载完成的图片设置了适当的尺寸属性，以确保它们在不同设备上都能正常显示。
