Now or Never

javaScript에서 for...of와 일반적인 for 루프의 성능 차이는 사용하는 용도에 따라 다르지만 보통 for의 성능이 좋다1. for동작 방식: for 루프는 인덱스를 기반으로 배열이나 반복 가능한 객체에 직접 접근한다.성능: 배열의 길이가 크고 단순히 인덱스를 사용해 값을 순회할 때, 최적화가 잘 되어 있기 때문에 성능 면에서 이점이 있다.const arr = [1, 2, 3, 4]; for (let i = 0; i 2. for...of동작 방식: for...of는 반복 가능한 객체(iterable)에서 값 자체를 순회한다. 배열 외에도 Map, Set 같은 다른 이터러블 객체에도 사용할 수 있다.성능: for...of는 내부적으로 이터레이터를 생성하고 그 값을 가져오기 때문에, 단순 배열 ..

프론트엔드에서 렌더링은 범용적인 용어이다, 브라우저에서도 리액트에서도 렌더링이 발생한다. 리액트에서 렌더링은 무엇일까? TL;DR 렌더링이란?브라우저 DOM을 직접적으로 수정하는 비용을 줄이기 위해 React에서 수행하는 작업이며 브라우저 DOM을 업데이트할 범위를 결정하고 반영하는 과정. Trigger, Render, Commit리엑트는 "렌더링과정"을 통해 브라우저 DOM을 업데이트할 범위를 결정하고 반영한다. 여기서 렌더링과정은 "Trigger", "Render", "Commit" 단계로 나뉜다.  Trigger렌더링을 유발하는 단계로 두 가지 상황이 있다.1. 앱 시작 초기(initial render)initial render는 target DOM node(root)와 함께 createRoot를 ..

nc example.com 80 nc (netcat) 명령어를 터미널에 입력하면 간단하게 TCP 연결을 생성할 수 있다. GET / HTTP/1.0Host: example.com 그 다음 GET 요청을 작성한 뒤 엔터를 누르면 response를 받을 수 있다.   터미널에서 명령어를 통해 간단하게 TCP 연결 및 HTTP 요청을 수행했다! HTTP 요청과 응답을 하나씩 뜯어보면 request header 분석GET / HTTP/1.0GET: HTTP method를 의미/: 요청 urlHTTP/1.0: HTTP 버전 Host: example.com: 요청 도메인 이름 response header 분석HTTP/1.0 200 OKHTTP/1.0: HTTP 버전200 OK: 응답 상태 코드 그 외 key:va..

deprecated된 dataIdFromObject를 keyFields로 변경하면서 생긴 이슈 기록 Apollo Graphql은 Object 타입을 캐시할 때 기본 식별자로 id 필드를 사용한다. Object에 id필드가 없거나 다른 필드를 식별자로 사용하고 싶은 경우 커스텀 할 수 있다. Configuring the Apollo Client cachekeyFields: ["title", "author", ["name"]],www.apollographql.com 커스텀할 때 dataIdFromObject 또는 KeyField를 사용할 수 있는데 공식문서에서는 KeyFields 사용을 권장한다.  dataIdFromObject의 세 가지 결점 1) It's sensitive to aliasing mista..

Presigned Url A Presigned URL is a URL that provides temporary, secure access to a specific resource in cloud storage (like Amazon S3) without needing the client to have full access credentials. It is commonly used in scenarios where a client needs to upload or download files directly to/from cloud storage, while the server still controls access.  How Presigned URLs Work When a presigned URL is ..

React Graphql Masterclass32. Data Resolver - Overriding A Field GraphQL 서버는 graphql 요청시 scalar 타입이면 값을 그대로 response하고 object 타입이면 object 타입의 각 필드마다 관련된 매핑 함수가 있는지 확인한다.  예를 들어 아래와 같은 데이터 구조에서type Query { sayHello: String customers: [Customer]!}type Customer { id: ID name: String age: Int city: String}public class Customer { private Integer id; private String name; priv..