์ด๋ฏธ์ง ํฝ์ ๋ณ๊ฒฝ (๋ณด์ด๋ ํฝ์ ์ 2๋ฐฐ๋ก ์ค์ ํ๋ ๊ฒ์ด ์ข๋ค. )
์ฒญํฌ ํ์ผ์ ๊ตฌ์ฑ์ ์์ธํ ๋ณด๊ธฐ ์ํ๋ค๋ฉด webpack bundle analyzer (npm)
cra-bundle-analyzer (cra ํ๋ก์ ํธ์์ eject ์์ด ์ฌ์ฉ ๊ฐ๋ฅ) : https://www.npmjs.com/package/cra-bundle-analyzer
cra-bundle-analyzer
Use Webpack Bundle Analyzer on a create-react-app application without ejecting. Latest version: 0.1.1, last published: 3 years ago. Start using cra-bundle-analyzer in your project by running `npm i cra-bundle-analyzer`. There is 1 other project in the npm
www.npmjs.com
์ด๋ฏธ์ง ์์ถ ๋๊ตฌ : squoosh : https://squoosh.app/
Squoosh
Simple Open your image, inspect the differences, then save instantly. Feeling adventurous? Adjust the settings for even smaller files.
squoosh.app
์ฌ์ฉํ์ง ์๋ css ์ ๊ฑฐํด์ฃผ๋ ํด: purgecss : https://purgecss.com/
PurgeCSS - Remove unused CSS | PurgeCSS
purgecss.com
์ด๋ฏธ์ง ์ง์ฐ ๋ก๋ฉ: intersection observer & react-lazyload: https://www.npmjs.com/package/react-lazyload
react-lazyload
Lazyload your components, images or anything where performance matters.. Latest version: 3.2.1, last published: 4 months ago. Start using react-lazyload in your project by running `npm i react-lazyload`. There are 451 other projects in the npm registry usi
www.npmjs.com
๋์์ ์์ถ : media.io : https://www.media.io/
Media.io - Online Video, Audio, Image AI Tools
Unlock the power of AI with our all-in-one online media processing tools for video, audio, and image. Perfect for content creators, our tools include advanced features such as a video editor, object remover, and noise reducer to easily enhance your media.
www.media.io
ํฐํธ์ ๋ค์ด๋ก๋ ์์ ์๊ณ ์ถ์๋ : fontfaceobserver ๋ผ์ด๋ธ๋ฌ๋ฆฌ : https://fontfaceobserver.com/
Font Face Observer โ fast and simple web font loading
Thereโs more to choosing a webfont than aestheticsโrendering, language support, hosting, and licensing are equally crucial to communicating your message. Think of webfonts as progressive enhancement, and learn how to harness CSS and browser features to
fontfaceobserver.com
ํฐํธ ํฌ๋งท ๋ณ๊ฒฝ : https://transfonter.org/
Online @font-face generator
The @font-face CSS rule allows web developers to specify online fonts to display text on their web pages. By allowing authors to provide their own fonts, @font-face eliminates the need to depend on the limited number of fonts users have installed on their
transfonter.org
์๋ฐ์คํฌ๋ฆฝํธ ๋ฐ css ๋ฆฌ์์ค์์ ์ค์ ๋ก ์คํํ๋ ์ฝ๋๊ฐ ์ผ๋ง๋ ๋๋์ง ์๋ ค์ฃผ๊ณ ๊ทธ ๋น์จ์ ์๊ณ ์ถ์๋
coverage ํจ๋
'๐ฅFrontEnd' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| jest ์ฉ๋๋ณ ๋งค์ฒ ์์๋ณด๊ธฐ (0) | 2024.09.21 |
|---|---|
| Jest ๊ธฐ๋ณธ ๊ณต๋ถํ๊ธฐ, ์ฝ๊ฒ Jest๋ก ํ ์คํธํ๋ ์ต์คํ ์ ์ถ์ฒ (0) | 2024.09.09 |
| IntersectionObserver ๋ก ์คํฌ๋กค ์ด๋ฒคํธ (0) | 2024.08.28 |
| jest, beforeAll, afterAll (0) | 2023.05.01 |
| jest ๊ธฐ๋ณธ ๊ณต๋ถ (0) | 2023.04.28 |
