ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 미디엄 게시글을 읽고 - 2025/01/08
    카테고리 없음 2025. 1. 8. 09:15
    제목

    Micro Frontend Architecture

    How to Build Websites That Load Before You Blink: Frontend Optimization Tips

    출처 https://medium.com/gitconnected/micro-frontend-architecture-b14b3a2c39a0 https://medium.com/javascript-in-plain-english/the-ultimate-guide-to-web-performance-essential-techniques-for-frontend-developers-c8638e5bf8d3
    요약 마이크로 프론트엔드 아키텍처는 복잡한 웹 애플리케이션을 작고 독립적인 모듈로 분할하는 현대적인 개발 접근 방식입니다

    이 방식은 각 팀이 독립적으로 개발하고 배포할 수 있으며, 다양한 기술 스택을 사용할 수 있게 해줍니다

    넷플릭스와 같은 대규모 웹 서비스에서 실제로 적용되고 있으며, 모듈 페더레이션 같은 기술을 통해 효율적인 프론트엔드 개발을 가능하게 합니다
    웹 성능 최적화에 대한 포괄적인 가이드로, 브라우저가 웹 페이지를 렌더링하는 과정과 성능 개선 전략을 다룹니다.

    주요 내용
    성능의 중요성
    사용자 경험 향상
    전환율 증가
    검색 엔진 최적화
    모바일 사용자 대응

    핵심 성능 지표
    First Contentful Paint (FCP)
    Largest Contentful Paint (LCP)
    First Input Delay (FID)
    Cumulative Layout Shift (CLS)

    브라우저 렌더링 과정
    Critical Rendering Path (CRP)
    HTML 파싱 (DOM 생성)
    CSS 파싱 (CSSOM 생성)
    자바스크립트 실행
    렌더 트리 구성
    레이아웃 계산
    페인팅

    최적화 핵심 전략
    점진적 DOM 구축
    중요 CSS 인라인
    자산 최적화
    CDN 활용
    레이지 로딩 

     

Designed by Tistory.