From 9165879f590d3448d528551d181aca993052dad7 Mon Sep 17 00:00:00 2001 From: oriverk Date: Mon, 25 Mar 2024 23:13:26 +0900 Subject: [PATCH] perf: enable astro prefech --- astro.config.mjs | 1 + src/components/Hero.svelte | 2 +- src/components/PostPagination.svelte | 12 +++++------ src/components/Search/AlgoliaIcon.svelte | 26 ------------------------ src/components/Search/BlogHit.svelte | 4 ++-- src/components/Search/index.svelte | 14 ++++++++----- src/components/ui/Icon.svelte | 6 ++++++ src/layouts/Header.astro | 2 +- 8 files changed, 26 insertions(+), 41 deletions(-) delete mode 100644 src/components/Search/AlgoliaIcon.svelte diff --git a/astro.config.mjs b/astro.config.mjs index 9d72e8c..461e82e 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -17,6 +17,7 @@ import { export default defineConfig({ site: "https://oriverk.dev", publicDir: "./public", + prefetch: true, integrations: [ svelte(), // NOTE: expressiveCode must be before mdx diff --git a/src/components/Hero.svelte b/src/components/Hero.svelte index 544ba55..de5d3d2 100644 --- a/src/components/Hero.svelte +++ b/src/components/Hero.svelte @@ -36,7 +36,7 @@ function closeDialog() { Search - + Blog link diff --git a/src/components/PostPagination.svelte b/src/components/PostPagination.svelte index efdbf98..4a8d950 100644 --- a/src/components/PostPagination.svelte +++ b/src/components/PostPagination.svelte @@ -14,28 +14,28 @@ const tab = (index: number) => (index === currentPage ? -1 : 0);
    {#if prev}
  1. - << + <<
  2. - < + <
    3. {/if} {#if size < total}
  3. - 1 + 1
    4. {/if} {#each [...Array(maxPage - 1)] as _, index}
  4. - {index+2} + {index+2}
    5. {/each} {#if next}
  5. - > + >
  6. - >> + >>
    7. {/if}
diff --git a/src/components/Search/AlgoliaIcon.svelte b/src/components/Search/AlgoliaIcon.svelte deleted file mode 100644 index 18502c5..0000000 --- a/src/components/Search/AlgoliaIcon.svelte +++ /dev/null @@ -1,26 +0,0 @@ - - - - {#if title} - {title} - {/if} - - - diff --git a/src/components/Search/BlogHit.svelte b/src/components/Search/BlogHit.svelte index 65239f3..16887f5 100644 --- a/src/components/Search/BlogHit.svelte +++ b/src/components/Search/BlogHit.svelte @@ -1,6 +1,6 @@ import type { Hit, SearchResponse } from "@algolia/client-search"; import { onMount } from "svelte"; -import type { AlgoliaBlog } from "../../types/algolia"; -import { searchAlgolia } from "../../utils/algolia"; -import AlgoliaIcon from "./AlgoliaIcon.svelte"; +import type { AlgoliaBlog } from "@/types/algolia"; +import { searchAlgolia } from "@/utils/algolia"; +import Icon from "../ui/Icon.svelte"; import BlogHit from "./BlogHit.svelte"; import SearchInput from "./SearchInput.svelte"; @@ -55,7 +55,7 @@ function selectHit() { if (hits[activeHit]) { const { id } = results.hits[activeHit]; if (!anchor || !id) return; - anchor.setAttribute("href", `https://blog.oriverk.dev/entry/${id}`); + anchor.setAttribute("href", `/blog/${id}`); anchor.click(); } } @@ -88,7 +88,7 @@ $: { target="_blank" rel="noopener noreferrer" > - + {#if !results?.nbHits} @@ -130,4 +130,8 @@ $: { flex-direction: column; gap: 0.5rem; } + + .search-icon-wrapper :global(.icon.algolia::before) { + height: 1.25rem; + } diff --git a/src/components/ui/Icon.svelte b/src/components/ui/Icon.svelte index d5e5fc9..2357365 100644 --- a/src/components/ui/Icon.svelte +++ b/src/components/ui/Icon.svelte @@ -7,6 +7,7 @@ interface $$Props { | "github" | "zenn" | "x" + | "algolia" | "pencil" | "magnifyingGlass" | "repository" @@ -94,6 +95,11 @@ export { type, size, color, style }; mask-image: url('/assets/x.svg'); } + .algolia::before { + mask-image: url('/assets/algolia.svg'); + aspect-ratio: 572 / 64; + } + /* general icon */ .pencil::before { mask-image: url('/assets/pencil.svg'); diff --git a/src/layouts/Header.astro b/src/layouts/Header.astro index cccf7c9..42f14c3 100644 --- a/src/layouts/Header.astro +++ b/src/layouts/Header.astro @@ -11,7 +11,7 @@ const isCurrent = (path: string) => path === Astro.url.pathname;