iframe은 일반적으로 권장되지 않는 방법으로 인식되어있다. 하지만 이번 우테코 프로젝트에서는 iframe을 이용하여 프로젝트를 진행했다. 프로젝트 주제는 댓글 모듈이었는데, 어떤 스크립트를 실행하면 원하는 웹 페이지의 어딘가에 댓글을 작성할 수 있는 UI와 기능이 제공되는 서비스였다. 처음에는 그냥 원하는 요소를 지정하면 그 밑에 UI를 추가하면 되겠거니 했으나, 그렇게 되면 댓글모듈의 UI의 rem단위들이 웹 페이지 별로 다르게 적용되어 동작하게 된다. 즉, 스타일의 분리가 이루어지지 않는다. 그리고, 댓글 기능이 있는 어느곳에서나 홍보같은 스팸성 댓글이 수두룩하게 도배되기 마련이다. 만약 이것들이 SEO에 반영이 된다면 어떨까? 스팸성 댓글이 달렸음에도 관리를 즉시 하지 않는다면, 바로 해당 웹페..
https://github.com/thedaviddias/Mac-OS-Setup-Applications?ref=producthunt GitHub - thedaviddias/Mac-OS-Setup-Applications: 👾 All I need to setup a new Mac and the applications I use everyday as a Web 👾 All I need to setup a new Mac and the applications I use everyday as a Web Developper - GitHub - thedaviddias/Mac-OS-Setup-Applications: 👾 All I need to setup a new Mac and the applications I use...
https://github.com/donavon/hook-flow/blob/master/hook-flow.pdf 위 그림은 리액트의 훅을 표시한것이다. 마운트 단계 마운트 단계에서는 Lazy Initializer가 동작한다. 이것은 useState( () => 1); 처럼 useState의 인자로 콜백함수를 넘겨서 초기화하는 것을 뜻한다. 이렇게하면 useState(1)가 함수 호출시 매번 초기화되는 것과 달리, 마운트 시점에 딱 1번만 초기화할 수 있다. 업데이트 단계 업데이트라 함은 당연히 상태값에 따른 Render가 수행될것이다. 근데, 이는 아마 Virtual DOM의 Render일 것이다. 실제 DOM의 렌더는 Browser paints screen 단계에서 일어난다. 2개의 Effect 근데 ..
https://github.com/microsoft/TypeScript/wiki/Performance GitHub - microsoft/TypeScript: TypeScript is a superset of JavaScript that compiles to clean JavaScript output. TypeScript is a superset of JavaScript that compiles to clean JavaScript output. - GitHub - microsoft/TypeScript: TypeScript is a superset of JavaScript that compiles to clean JavaScript output. github.com 번역 https://yceffort.kr/..
https://news.hada.io/topic?id=3057 왜 ARM칩엔 JavaScript 이름이 붙은 명령어가 있나요? | GeekNews - Arm v8.3-A 칩 이후 버전은 FJCVTZS 명령을 지원ㅤ→ Floating-point Javascript ConVert To Signed fixed-point, rounding toward Zero- JS는 숫자를 배정밀도(Double Precision) 실수형으로 처리하므로, 비트연산시 정수로 변환 news.hada.io https://news.hada.io/topic?id=3275 애플 CPU의 트릭들 - 메모리 리오더링, JS지원, Ref 카운팅 | GeekNews 1. 흑마법처럼 보이는 애플의 인텔코드 실행 속도는 기본적으로 Arm과 Inte..
https://hashmm.com/post/why-m1-so-fast/ M1칩이 빠른 이유 M1칩은 왜 빠를까?? hashmm.com https://news.hada.io/topic?id=3315 Apple M1칩은 왜 그렇게 빠를까? | GeekNews - M1은 한개의 CPU가 아니라, 대형 실리콘 패키지에 여러개의 칩들을 넣은 전체 시스템. CPU는 그중의 하나 일뿐ㅤ→ CPU,GPU,메모리,IO콘트롤러 등을 묶은 SoC(System on a Chip)- 범용 코어를 많이 넣는 대 news.hada.io M1은 1개의 CPU라기 보단, 어떤 실리콘 팩에 여러개 칩을 넣은 어떤 시스템을 뜻한다고 보는게 맞다. 즉, M1안에 CPU가 있는 것이다. 이런 CPU, GPU, Memory 등을 한번에 넣고 ..
웹팩은 오픈소스 자바스크립트 모듈 번들러이다. 모듈 번들러라고 함은, 웹 어플리케이션을 구성하는 자원 모두를 각각의 모듈로 보고, 그것을 조합해서 하나의 결과물을 만드는 것이다. 모듈은 일반적으로 관련된 데이터와 함수들을 묶어 파일 단위로 나누는 것을 뜻한다. 자바스크립트 초창기에는 html의 코드의 script 태그에 자바스크립트를 선언하여, 선언하는 외부 자바스크립트들의 변수명과 함수명이 재정의 되기도 하고, 순서에 다라 로직이 달라지고, 1개의 script 파일에서 에러가 나면, 어플리케이션이 멈춰버리는 현상이 있었다. 이런 모듈 시스템이 도입됨으로써 기능 별로 파일을 나눌 수 있게 되고, 서로의 스코프를 침범하지 않게 되어 위 문제들을 해결 할 수 있었다. 웹팩도 그렇다. 웹팩도 모든 자원을 모듈..
css에서 자식간의 관계에 대한 스타일을 부여할 경우 nth-child vs nth-of-type first-child vs first-of-type last-child vs last-of-type 에 대해서 고민하게 된다. 차이점은 ## nth-child(n) 이런 ~-child 류의 문법은 **부모 엘리먼트의 [모든] 자식 엘리먼트 중 n번째를 뜻한다.** ## nth-of-type(n) 이런 ~-of-type 류의 문법은 **부모 엘리먼트의 [특정] 자식 엘리먼트 중 n번째를 뜻한다.** 즉, span:nth-child(2)를 하면 모든 자식에서의 2번째 자식이다. 태그가 아무 상관이 없는 것이다. 하지만 span:nth-of-type(2)를 하면 자식들 중에 span인 녀석들 중 2번째이다. 특정..
