똑같은 삽질은 2번 하지 말자
[SEO] 웹 성능 개선 참고 본문
웹이 그려지는 과정과 최적화 방법에대해 자세히 나와있음
ui.toast.com/fe-guide/ko_PERFORMANCE
성능 최적화 | TOAST UI :: Make Your Web Delicious!
성능 최적화 애플리케이션 성능 최적화는 앱과 웹에서 모두 중요하다. 최근 웹 애플리케이션은 Ajax 통신, 복잡한 UI 등 많은 기능을 담으면서 크고 무거워졌다. 무거워진 웹은 긴 로딩 시간 함께
ui.toast.com
Core Web Vitals
구글에서 Core Web Vitals지표를 보고 검색랭킹에 반영한다는 발표를 2020년에 함
Core Web Vitals에 대하여 (SEO)
구글은 검색순위를 정할 때 Core Web Vitals 지표를 중시한다 | 구글은 검색 노출 순위를 정할때 페이지 탐색 경험 지표를 사용한다고 합니다. 좀 더 상세하게 설명하자면 사용자가 웹 페이지 이용
brunch.co.kr
Google Search Console 지표 설명
seopack.jp/seoblog/searchconsole-cls-lcp-fid/
サーチコンソールで目にする「CLS」「LCP」「FID」ってなに?改善方法は? | SEO Packの最新SEO情報
SEO Packのブログ「サーチコンソールで目にする「CLS」「LCP」「FID」ってなに?改善方法は?」の記事です。
seopack.jp
leap-in.com/ja/use-passive-true-avoid-janky/
passive: trueでなぜパフォーマンスがよくなるの?簡単な説明と使い方! | LeapIn
スクロールした際のパフォーマンスが悪い場合(スクロールがカクつく場合)にはpassive:trueの使用を検討しましょう。この記事ではイベントリスナーにpassive:trueというヒントを使うことで、
leap-in.com
자바스크립트의 이벤트 루프(함수가 실행되는 원리도 설명하고있다.)
[JS] JavaScript의 Event Loop
[JS] Javascript 작동 원리에 대해서, Event Loop Javscript를 공부하다 보면 이런 말을 종종 듣는다. 싱글스레드 기반으로 동작하는 자바스크립트 이벤트 루프를 기반으로 하는 싱글 스레드 Node.js 이런
asfirstalways.tistory.com
wheel, mousewheel, touchstart, touchmove 이벤트 최적화
amati.io/eventlisteneroptions-passive-true/
{ passive:true } 의 진정한 의미 - amati.io
addEventListener는 대상에 지정한 이벤트가 들어올 경우 호출할 함수를 등록하는 method입니다. 자바스크립트를 하는 사람이라면 누구나 아는 기초적인 method이죠. 하지만, 과거에는 addEventListener가 웹
amati.io
웹캐시
웹 캐시(WEB Cache)란 무엇인가?(특징)
개요 > 웹 캐시(WEB Cache)가 무엇(What)인가? > 웹 캐시(WEB Cache)를 사용하는 이유(Why)? 멋대로 요약 캐싱 기본 개념 : 캐싱(Caching)은 애플리케이션의 처리 속도를 높여준다. 이미 가져온 데이터나.
hahahoho5915.tistory.com
Vue 퍼포먼스 개선
Vue Devtools 퍼포먼스 개선 포인트 찾기 - 데브현
아래는 Qiita에 개재된 「Vue Devtoolsでパフォーマンス改善ポイントを見つける」를 번역한 내용입니다. 다소 의역이 있어 어색한 부분이 있어도 양해 부탁드립니다. 🙉 원문 보기 이 포스팅은 Vue.
devhyun.com
라라벨 5.8 - 블레이드 템플릿
라라벨 한글 메뉴얼 5.8 - 블레이드 템플릿
laravel.kr
이미지 최적화
1. 이미지 CDN 을 통해 최적화된 크기로 전달하거나
2. 언스플래쉬
https://unsplash.com/documentation#supported-parameters
Unsplash API Documentation | Free HD Photo API | Unsplash
Getting started This document describes the resources that make up the official Unsplash JSON API. If you have any problems or requests, please contact our API team. Creating a developer account To access the Unsplash API, first join. Registering your appl
unsplash.com
이런식으로도 가능
3. static 리소스면 직접 수정
bottlenect 코드 탐색?
google tag manager prefetch preconnect
paranishian.hateblo.jp/entry/2018/11/02/183724
Resource Hintsの対応をしてWebPageTestの点数を改善した - paranitips
はじめに いま開発チームでサイト速度改善に取り組んでいて、 その一環でResource Hintsの対応をしたので、調べたこととリリース後の効果をまとめます🙌 調べたこと まずはResource Hintsについ
paranishian.hateblo.jp
이미지 최적화 사이트
온라인 이미지 최적화기
Optimizilla는 궁극의 이미지 최적화기로 당신의 JPEG과 PNG 포맷을 가능한 최소 크기로 압축합니다.
imagecompressor.com
번들 최적화에 대한 기사
How to drastically reduce your bundle size and load time in Vue.js
Performance is one of the most important aspects when it comes to web applications. Here’s how we improved our Vue.js app’s performance.
medium.com
CLS 수정 방법
CLS(Cumulative Layout Shift)を計測してみた! | 株式会社アルタのごった煮ブログ
マークアップエンジニアのアシュリーです。今日は、Core Web VitalsのひとつであるCLS(Cumulative Layout Shift)の話。 Core Web Vi...
www.alta.co.jp
LCP 에 관한 article
Optimize Largest Contentful Paint
Largest Contentful Paint (LCP) can be used to determine when the main content of the page has finished rendering on the screen. Learn how to optimize LCP by improving slow server response times, resource load times and client-side rendering.
web.dev
클라우드 플레어
www.ridicorp.com/story/cloudflare-dos-and-donts/
Cloudflare 도입 후기 - 리디주식회사 RIDI Corporation
5년간의 Cloudflare 사용 후기를 공유합니다.
ridicorp.com
Core Web Vitals 에 관한 가이드
https://www.contentkingapp.com/academy/core-web-vitals/
The Ultimate Guide to Core Web Vitals
Give your users a better user experience!
www.contentkingapp.com
'SEO' 카테고리의 다른 글
Google Tag Manager에서 dataLayer로 변수 셋팅하기 (0) | 2022.04.03 |
---|---|
Firebase Analytics와 Google Tag Manager 연동 (0) | 2022.03.30 |
[SEO] h1,h2.. 태그, img의 alt 속성, Sementic Tags의 활용 (0) | 2022.01.30 |
[SEO] noindex nofollow (1) | 2021.08.31 |