feat: lazy load icons

This commit is contained in:
Shusui MOYATANI
2023-12-28 00:20:18 +09:00
parent 576778f2fc
commit e97e29a0d7

View File

@@ -1,5 +1,6 @@
import { Component, JSX, Show, createSignal } from 'solid-js'; import { Component, JSX, Show, createSignal } from 'solid-js';
import LazyLoad from '@/components/utils/LazyLoad';
import useDetectOverflow from '@/hooks/useDetectOverflow'; import useDetectOverflow from '@/hooks/useDetectOverflow';
import useFormatDate from '@/hooks/useFormatDate'; import useFormatDate from '@/hooks/useFormatDate';
import { useTranslation } from '@/i18n/useTranslation'; import { useTranslation } from '@/i18n/useTranslation';
@@ -41,7 +42,11 @@ const Post: Component<PostProps> = (props) => {
}} }}
> >
<Show when={author()?.picture} keyed> <Show when={author()?.picture} keyed>
{(url) => <img src={url} alt="icon" class="h-full w-full rounded object-cover" />} {(url) => (
<LazyLoad>
{() => <img src={url} alt="icon" class="h-full w-full rounded object-cover" />}
</LazyLoad>
)}
</Show> </Show>
</button> </button>
<div class="min-w-0 flex-auto"> <div class="min-w-0 flex-auto">