본문 바로가기

분류 전체보기91

가상 DOM 그리고 DOM 가상돔을 이해하기 위해서는 아래 두개의 링크를 보고와야한다. https://parkjaeho.tistory.com/84 DOM (document object model) + CSSOM DOM 브라우저가 한줄 한줄 html을 읽으면서 파싱한다.(돔 document object model 요소로 변환) 파싱이란? 문자를 -> 객체로 바꾸는 것 즉 브라우저가 html 태그,텍스트 등등 , javascript 가 이해할 수 있는 objec parkjaeho.tistory.com https://parkjaeho.tistory.com/85 Critical Rendering Path Critical Rendering Path construction part. , operation part. request/respon.. 2021. 7. 1.
flex item 속성 flex-basis flex-item 의 기본 크기를 설정한다. (부모의 flex-direction이 row일 때는 너비, column일 때는 높이) 메인 축 기준★ default 는 auto 이다 -->기존 자기 자신의 width or height 를 base로 가질래 !! 하는 것이 => auto width: 200px 일 경우 default : auto 라면 base 는 200px. 그렇다면 flex-basis : 0 일경우? 자기 자신의 content 크기 만큼 가진다. flex-direction이 row 라고 가정해보자. 각 flex items 들에게 flex-basis width 값을 주었을 경우 (좀 더 유연하다) flex-basis : 100px; (아이템이 점유하는 크기) 아이템 원래 요.. 2021. 6. 26.
react react element ? HTML 태그 처럼 사용 할 수 있는 것을 리액트 요소라고한다. jsx를 사용해 리액트 요소를 만든다. ex) 텍스트!! React 요소는 실제 DOM 요소가 아니고 JavaScript 객체이다. JSX가 하는 일은 React Element를 만드는 것.!!! JSX 란 ? 자바스크립트 구문 확장 . JS + XML ( ECMAScript 표준과 관련이 없다 ) HTML이 아니다 JavaScript를 확장한 문법이다. 개발자가 작성한 리액트의 JSX 코드를 Babel 이 React.createElement( )로 컴파일해준다. 그 후 실제 DOM에 적용 - jsx 는 javascript 객체를 반환. - jsx 내부에서 js 표현식을 사용하고 싶을 경우 { } 사용하자. -j.. 2021. 6. 5.
PureComponent PureComponent 란? props,state가 변경되지 않는 이상 re - render 함수 호출 하지 않는다. PureComponent는 shouldComponentUpdate()를 구현한다 . PureComponent는 shollow comparison.를 한다 => 이전의 props,state와 현재의 props,state를 비교한다. 객체의 프로퍼티가 변경되는건 아무런 상관이 없고 주소값을 기준으로 판단한다. x 의 주소값이 변경 되면 re-render를 한다. React.Component doesn’t implement shouldComponentUpdate(), https://reactjs.org/docs/react-api.html#reactpurecomponent 2021. 5. 27.
JS Runtime Environment js는 런타임때 타입이 정해진다 다이나믹한 타입 3-'2' => 1 작성한 코드가 컴파일때 코드가 결정되고 확인 된다면 , statically typed. 프로그램이 동작할때 타입이 확인되고 동작하는것이 dynamically typed. * dynamically typed. 타입이 동적으로 결정이된다. let name = 123; name = 'hahaha'; * statically typed. let age : number = 10; age = 'hahaha'; (X) 타입을 명시해서 작성해주어야 하고, 한번 결정된 타입은 절때 바뀔수가없다. 다른 타입으로 할당하게 될 경우 컴파일때 오류발생. 웹 API = 브라우저에서 제공하는 API (멀티 스레드 가능) JS = 싱글 스레드 (동시에 처리 가능 한 .. 2021. 5. 18.
프로세스,스레드 .exe : 프로그램 파일 프로세스 : 운영체제 위에서 연속적으로 실행되고있는 프로그램. 컴퓨터는 프로세스마다 자원을 분할해서 할당한다. 스레드 : 프로세스 안에서 있는 작은 일꾼 멀티 스레드 : 프로세스 안에서 여러가지 쓰레드가 동시다발적으로 일어나는 것. Operation system > 공장 Process > 생산라인 Thread > 일꾼 한 공장 내에서 다양한 것들을 생산하는 라인이 작동한다. 일꾼이 1명뿐인 라인은 그 일꾼이 A라는 일도 하고, B라는 일도 해야할 때 A를 끝내고 나서야 B를 할 수 있다. 일꾼이 2명이 되면, 한 일꾼은 A를 하고 다른 일꾼은 B를 동시에 할 수 있다. 각 일꾼은 자기가 해야 하는 일의 순서를 기억하고 있다. 단, 일꾼이 같은 공구(공유 리소스)를 사용할 때 한.. 2021. 5. 18.
Scope 자바스크립트에서 함수를 선언하면 함수를 선언할 때마다 새로운 스코프를 생성하게 된다. 스코프(Scope)란 ‘변수 또는 함수에 접근할 수 있는 범위’. 전역 스코프 (Global scope): 코드 어디에서든지 참조할 수 있다. { }바깥에서 선언되었다면, 전역 스코프에 정의 된다. 지역 스코프(Local Scope) : 해당 지역에서만 접근해야한다 해당 지역에서만 접근할 수 있어 지역을 벗어난 곳에선 접근할 수 없다. 만약 지역스코프에서 전역스코프에 있는 함수를 사용할 경우 전역스코프 함수가 호출이된다 그러므로 함수 몸체에 선언한 함수는 해당 함수 몸체 안에서만 접근할 수 있다. Class 도 함수다. { } 지역스코프 사용. methodA(){} 메소드에 methodB() 를 this 없이 호출 할 .. 2021. 5. 14.

티스토리툴바