reonokiy/blog
1
0
Fork 0
mirror of https://github.com/reonokiy/blog.nokiy.net.git synced 2025-06-17 03:56:19 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

perf: optimize dom selectors for better performance

Browse source
This commit is contained in:
radishzzz 2025-05-19 03:12:55 +01:00
parent bfe3771571
commit beb3386edc
10 changed files with 26 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/Widgets/BackButton.astro
View file

@ -5,7 +5,7 @@ import GoBackIcon from '@/assets/icons/go-back.svg';
<button
id="back-button"
class="hidden"
lg="block absolute c-secondary/40 left--10 top-1/2 aspect-square w-4.5 translate-y--1/2 transition-colors ease-out c-secondary active:scale-90! hover:c-primary/80"
lg="block absolute c-secondary/40 left--10 top-1/2 aspect-square w-4.5 translate-y--1/2 transition-colors ease-out c-secondary active:scale-90! hover:c-secondary/80"
aria-label="Go back"
>
<GoBackIcon

14
src/components/Widgets/GithubCard.astro
View file

@ -1,6 +1,6 @@
<script>
function setupGithubCards() {
const githubCards = document.querySelectorAll('.gc-container')
const githubCards = document.getElementsByClassName('gc-container')
if (githubCards.length === 0)
return
@ -14,7 +14,7 @@ function setupGithubCards() {
})
}, { rootMargin: '400px' })
githubCards.forEach(card => observer.observe(card))
Array.from(githubCards).forEach(card => observer.observe(card))
}
async function loadCardData(card: HTMLElement) {
@ -22,11 +22,11 @@ async function loadCardData(card: HTMLElement) {
if (!repo)
return
const avatarEl = card.querySelector('.gc-owner-avatar') as HTMLElement
const descEl = card.querySelector('.gc-repo-description') as HTMLElement
const starsEl = card.querySelector('.gc-stars-count') as HTMLElement
const forksEl = card.querySelector('.gc-forks-count') as HTMLElement
const licenseEl = card.querySelector('.gc-license-info') as HTMLElement
const avatarEl = card.getElementsByClassName('gc-owner-avatar')[0] as HTMLElement
const descEl = card.getElementsByClassName('gc-repo-description')[0] as HTMLElement
const starsEl = card.getElementsByClassName('gc-stars-count')[0] as HTMLElement
const forksEl = card.getElementsByClassName('gc-forks-count')[0] as HTMLElement
const licenseEl = card.getElementsByClassName('gc-license-info')[0] as HTMLElement
try {
const response = await fetch(`https://api.github.com/repos/${repo}`)

3
src/components/Widgets/GsapAnimation.astro
View file

@ -3,7 +3,8 @@ import { gsap } from 'gsap'
function setupPostPageAnimation() {
const allElements = Array.from(document.querySelectorAll('#gsap-post-page-content > *, #gsap-post-page-tags, #waline'))
const tocListChildren = Array.from(document.querySelectorAll('#toc-list > *'))
const tocList = document.getElementById('toc-list')
const tocListChildren = tocList ? Array.from(tocList.children) : []
const dateElement = document.getElementById('gsap-post-page-date')
const backButton = document.getElementById('back-button')
const tocIcon = document.getElementById('toc-icon')

3
src/components/Widgets/PhotoSwipe.astro
View file

@ -10,7 +10,8 @@ function setupPhotoSwipe() {
if (bodyElement.hasAttribute('data-photoswipe-initialized'))
return
const images = document.querySelectorAll('article.heti img')
const article = document.querySelector('article.heti')
const images = article ? article.getElementsByTagName('img') : []
if (images.length === 0)
return

4
src/components/Widgets/TOC.astro
View file

@ -154,7 +154,7 @@ function setupTOCHighlight() {
if (!tocContent)
return
const tocLinks = tocContent.querySelectorAll('a')
const tocLinks = tocContent.getElementsByTagName('a')
if (tocLinks.length === 0)
return
@ -163,7 +163,7 @@ function setupTOCHighlight() {
// Build mapping from heading IDs to TOC links
const headingMap = new Map<string, HTMLAnchorElement>()
tocLinks.forEach((link) => {
Array.from(tocLinks).forEach((link) => {
const id = link.getAttribute('href')?.substring(1)
if (id)
headingMap.set(id, link as HTMLAnchorElement)