인프런 커뮤니티 질문&답변

열씨미살자!님의 프로필 이미지
열씨미살자!

작성한 질문수

Slack 클론 코딩[실시간 채팅 with React]

Q&A(CRA를 안 쓰는 이유)

inline css에 관한 질문

작성

·

230

0

body 부분과 전체적으로 적용시켜야되는 css를 index.html에 inline으로 적용시켜주셨는데요. web dev 사이트에서 찾은 내용이  처음 css를 로드할때 14KB가 넘지 않도록 조정하는 것이 좋고 스크롤없이 볼 수 있는 부분만 css를 인라인으로 빠르게 넘겨주는게 좋다라고 이해를 했습니다. 그래서 critical.js라는 라이브러리를 사용해서 직접 css를 index.html에 넣지 않고도 자동으로 만들어지게 할 수 있는 것 같습니다. 강사님이 강의에서 말씀하신 부분이 이부분들이 맞을까요?

https://web.dev/codelab-extract-and-inline-critical-css/

답변 2

0

감사합니다!

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 맞습니다. 기본적으로 사용자가 처음에 보는 부분까지만 인라인화시켜주면 좋습니다.

한가지 더 질문이 생겼는데 혹시 nextjs에서는 reset.css나 전역적으로 셋팅해줘야하는 css를 어디에 넣어주시나요? _document.tsx에 넣어주면 될 것 같은데 좀 헷갈립니다.

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

_app.tsx에 import하거나 document.tsx에 링크로 넣으시면 됩니다.

열씨미살자!님의 프로필 이미지
열씨미살자!

작성한 질문수

질문하기