해나아부지 개발일지

display: flex는 레이아웃을 구성하기 위한 유용한 CSS 속성 중 하나입니다. 그러나 많은 flex 속성을 사용하는 것은 렌더링 속도에 영향을 미칠 수 있습니다. display: flex를 사용하면 브라우저는 레이아웃을 계산하기 위해 추가 작업을 수행해야 합니다. 이 작업은 브라우저의 처리 속도와 요소의 수 및 복잡도에 따라 렌더링 속도에 영향을 미칩니다. 따라서, display: flex는 꼭 필요할 때만 사용하는 것이 좋다는 말씀. 렌더링 속도를 향상시키기 위해 flex 속성 대신에 grid 레이아웃 등 다른 CSS 속성을 사용하는 것이 좋다.

rel 속성: 리소스의 관계를 지정하는 속성입니다. 우선순위를 제어하기 위해서는 rel 속성 값으로 preload를 사용해야 합니다. as 속성: 가져올 리소스의 유형을 지정하는 속성입니다. 가능한 값으로는 image, style, script, font, document, audio, video, fetch 등이 있습니다. 이 중 fetch를 사용하면 특정 URL을 가져와서 캐시에 저장할 수 있습니다. type 속성: 가져올 리소스의 MIME 유형을 지정하는 속성입니다. 예를 들어, type="text/css"는 CSS 파일을 가져올 때 사용합니다. media 속성: 리소스를 가져오는 미디어 유형을 지정하는 속성입니다. 예를 들어, media="print"를 사용하면 인쇄할 때 사용하는 스타일 시트를 ..

TCP/IP 세 개의 요소로 구성되어 있으며, 전송 계층에서 사용되는 TCP (Transmission Control Protocol) 프로토콜에서 연결을 설정하는 방법(establishing a connection in the TCP (Transmission Control Protocol)입니다. 다음과 같은 단계로 작동한다. 1. 클라이언트에서 서버로 SYN(Synchronize Sequence Number) 패킷을 보낸다. - SYN : 두 기기(클라이언트 & 서버)의 초기 연결 수립을 위한 패킷 - 패킷: 네트워크에서 전송을 위한 데이터 단위(unit of data that is transmitted over a network) 2. 서버는 SYN 패킷을 받고, 클라이언트에게 ACK (Acknowl..

HTTP 캐싱을 활용하기 위해 다음과 같은 값들을 설정할 수 있습니다: 캐시 제어 헤더 (Cache-Control header): 이 헤더를 사용하여 캐시 동작을 제어할 수 있습니다. 예를 들어, max-age 값을 설정하여 캐시가 유효한 시간을 정할 수 있습니다. 또한, no-cache, no-store, must-revalidate 등의 값을 설정하여 캐시를 사용하지 않거나 갱신해야 하는지 여부를 제어할 수 있습니다. ETag: 이 값은 캐시된 리소스가 원본과 같은지 확인하는 데 사용됩니다. 원본이 변경되면 ETag 값도 변경되므로, 캐시된 리소스가 더 이상 유효하지 않은 경우 서버로부터 새로운 리소스를 가져와야 합니다. Last-Modified: 이 값은 리소스가 마지막으로 수정된 시간을 나타냅니다..

프론트엔드 업무에서는 사용자 인터페이스(UI)와 관련된 웹 페이지를 개발합니다. UI는 주로 웹 브라우저에서 실행되며, 웹 브라우저는 인터넷을 통해 서버에서 데이터를 가져와 UI에 표시합니다. 따라서 네트워크 환경에서 데이터가 오가는 과정을 이해하는 것은 프론트엔드 업무에서 매우 중요합니다. 데이터 가져오기: 프론트엔드 개발자는 데이터를 가져와서 UI에 표시해야 합니다. 이 데이터는 서버에서 가져와야 할 수도 있으며, 이를 위해서는 데이터 전송 프로토콜, HTTP 요청 및 응답, CORS 등에 대한 이해가 필요합니다. 데이터 전송 방법: 데이터를 가져오는 방법은 매우 중요합니다. 일부 데이터는 실시간으로 업데이트되어야 하며, 이를 위해서는 WebSocket과 같은 실시간 통신 프로토콜을 사용해야 할 수도..

문제 해결: 데이터 전송 중 문제가 발생할 경우, 오류를 찾아내고 해결하는 데 도움이 됩니다. 예를 들어, 데이터가 손실되거나 손상될 수 있습니다. 이러한 문제는 대개 데이터가 이동하는 경로를 추적하여 해결할 수 있습니다. 보안: 데이터는 민감한 정보를 포함할 수 있으므로, 데이터가 전송되는 방식을 이해하는 것은 보안 측면에서 매우 중요합니다. 암호화, 인증 및 권한 부여 등의 보안 기능이 데이터 전송 프로세스에 포함될 수 있으며, 이러한 기능을 이해하면 데이터 보안을 강화할 수 있습니다. 최적화: 데이터 전송 프로세스를 최적화하여 더 빠르고 효율적인 데이터 전송을 할 수 있습니다. 데이터가 전송되는 방식, 전송 프로토콜, 데이터의 크기 및 형식 등을 고려하여 최상의 데이터 전송 방법을 결정할 수 있습니..