chore: update image attrs

This commit is contained in:
Steven
2024-01-13 14:08:36 +08:00
parent 16e68fbfff
commit a8074d94e8
5 changed files with 8 additions and 2 deletions

View File

@ -4,7 +4,7 @@ interface Props {
} }
const Image: React.FC<Props> = ({ altText, url }: Props) => { const Image: React.FC<Props> = ({ altText, url }: Props) => {
return <img alt={altText} src={url} />; return <img src={url} alt={altText} decoding="async" loading="lazy" />;
}; };
export default Image; export default Image;

View File

@ -39,6 +39,7 @@ const MemoResourceListView = ({ resourceList = [] }: { resourceList: Resource[]
src={resource.externalLink ? url : `${url}${thumbnail ? "?thumbnail=1" : ""}`} src={resource.externalLink ? url : `${url}${thumbnail ? "?thumbnail=1" : ""}`}
onClick={() => handleImageClick(url)} onClick={() => handleImageClick(url)}
decoding="async" decoding="async"
loading="lazy"
/> />
); );
} else if (type === "video/*") { } else if (type === "video/*") {

View File

@ -128,6 +128,8 @@ const PreviewImageDialog: React.FC<Props> = ({ destroy, imgUrls, initialIndex }:
onTouchMove={handleTouchMove} onTouchMove={handleTouchMove}
onTouchEnd={handleTouchEnd} onTouchEnd={handleTouchEnd}
onWheel={handleImgContainerScroll} onWheel={handleImgContainerScroll}
decoding="async"
loading="lazy"
/> />
</div> </div>
</> </>

View File

@ -27,10 +27,11 @@ const ResourceIcon = (props: Props) => {
return ( return (
<SquareDiv className={classNames(className, "flex items-center justify-center overflow-clip")}> <SquareDiv className={classNames(className, "flex items-center justify-center overflow-clip")}>
<img <img
loading="lazy"
className="min-w-full min-h-full object-cover border rounded dark:border-none" className="min-w-full min-h-full object-cover border rounded dark:border-none"
src={resource.externalLink ? resourceUrl : resourceUrl + "?thumbnail=1"} src={resource.externalLink ? resourceUrl : resourceUrl + "?thumbnail=1"}
onClick={() => showPreviewImageDialog(resourceUrl)} onClick={() => showPreviewImageDialog(resourceUrl)}
decoding="async"
loading="lazy"
/> />
</SquareDiv> </SquareDiv>
); );

View File

@ -12,6 +12,8 @@ const UserAvatar = (props: Props) => {
<img <img
className="w-full h-auto rounded-full shadow min-w-full min-h-full object-cover dark:opacity-80" className="w-full h-auto rounded-full shadow min-w-full min-h-full object-cover dark:opacity-80"
src={avatarUrl || "/logo.png"} src={avatarUrl || "/logo.png"}
decoding="async"
loading="lazy"
alt="" alt=""
/> />
</div> </div>