Graphics System

CSS Rendering 1회차

Fixed Number
- 고정된 숫자로 만들어진 그래픽스 시스템은 환경에 맞출 수 없다는 문제가 있다.
- 스마트폰의 크기, 가로와 세로모드 등 여러 환경이 있는데, 고정된 숫자로는 범용적인 그래픽스 시스템을 만들 수 없다.
Abstract Calculator
- %, Left, Inline, Float
- 환경을 인식해서 숫자로 바뀌는 것.
- 공식을 이용해서 숫자를 계산하게 하는 체계
- 즉, ‘함수’
Component
- 추상화된 그래픽스 시스템을 이어받는 공통적인 시스템
- 예) HTML의 tag
Framework
- 컴포넌트들을 일정한 규칙과 사용방법을 지키는 형태로 구현한 것
- 예) HTML 체계 전체
그래픽스 시스템은 Fixed Number에서 Abstract Calculator로 진화
그래픽스 시스템 : 점 찍는 방법

Rendering System

그림을 표현하기 위한 정보를 그림으로 표현하는 것.
Rendering System의 구성
1. Geometry Calculate
  - 어떻게 영역이 나눠져있는지 계산
  - 브라우저 - Reflow
2. Fragment Fill
  - 영역을 색칠하기
  - 브라우저 - Repaint

CSS Specification

CSS를 배운다 : CSS 속성과 값이 구체적으로 발현될 때는 어떠한 방식으로 계산되어서 표현되는지 이해하는데 있다.
CSS Level 1
- w3c에 css라는 것을 넣도록 제안
CSS Level 2 + Module
CSS Level 2.1
- 어떠한 그래픽스 시스템은 레벨업이 안되는 것이 있고, 어떤 것은 계속 발전하므로 레벨업이 되는 사양들이 있다.
- include level 3 module
  - syntax3, color3, background 3, fonts 3, text 3... 등등
Module Level
- transforms 1
- compositing 1
- effects 1
- grid 1
- flexbox 1
- masking 1

→ 현재는 CSS는 각 사양마다 레벨이 다름.

All CSS specifications

Other Specification

W3C community and business groups

WICG : Web Platform Incubator Community Group
- 구글이 이끔.
- 최신 스펙이 제일 많이 생기는 곳. WICG에서 크롬에 구현 먼저 하고, W3C에 draft 던져놓음.
RICG : Responsive Issues Community Group