JDevBlog

DOM 트리의 순회는 트리 자료구조의 순회 방법을 따른다. 트리구조 역시 자료를 효율적으로 탐색하고, 삽입이나 삭제할 수 있는 구조로 저장하는 것을 목적으로 하는 자료구조이기 때문에 효율적인 탐색 방법이 존재한다. 트리를 효율적으로 탐색하기 위해서는 타깃 노드에 도달할 때까지 최소한의 노드들을 거쳐가야 한다. 즉, 중복으로 방문하는 노드가 없어야 하는데 이를 위해 트리를 탐색하는 과정엔 방문한 노드를 기록하는 것도 포함되어 있다. 트리 자료구조의 노드를 탐색하여, 원하는 타깃을 찾아내는 방법에는 깊이 우선 탐색과 너비 우선 탐색이 있다. 깊이 우선 탐색 방법은 루트 노드로부터 계속해서 자식 노드로 내려가며 탐색하다가 마지막 자식 노드에 도달했을 때, 만약 아직 타깃을 찾지 못했다면 다시 부모 노드로 올라..

semantic versioning Semantic versioning (aka SemVer), is a widely adopted version scheme that uses a sequence of three digits (Major.Minor.Patch), an optional pre-release tag and optional build meta tag. backward-incompatible change increments the major number new functionality that is backwards compatible API additions/changes increments the minor number simple bug fix to existing functionality..

JSON stands for JavaScript Object Notation. A JSON file has .json as its extension and the data inside are represented in a key:value pair, just like a traditional JavaScript object. { "key1": "value1", "key2": "value2", "key3": "value3", "key4": 7, "key5": null, "favFriends": ["Kolade", "Nithya", "Dammy", "Jack"], "favPlayers": {"one": "Kante", "two": "Hazard", "three": "Didier"} } Accepted JSO..

What is Service Worker: A service worker is a script that runs independently in the browser background. On the user side, it can intercept its network requests and decide what to load (fetch). Service workers mainly serve features like background sync, push notifications and they are commonly used for’offline first’ applications, giving the developers the opportunity to take complete control ove..

CDN Content Delivery Network 웹페이지, 이미지, 동영상 과 같은 컨텐츠를 서버에서 사용자에게 전송하는 것 기존 단 하나의 서버의 문제점 클라이언트가 겪는 불편함: 전 세계에서 서버에 요청을 보내는 경우, 각 나라와의 서버의 거리가 멀 경우(물리적인 이유), 서버에서 컨텐츠를 받아오는 시간이 오래걸린다. 서버가 겪는 불편함: 수많은 요청들을 처리해야 한다는 점. CDN 서버는 컨텐츠 전달이라는 용도에 특화되어 서버의 요청 처리를 분산한다. CDN 업체가 전세계 곳곳에 서버를 두고 있다면, 요청을 클라이언트에게 가장 빠르게 서비스를 제공할 수 있는 CDN 서버에서 해당 요청을 처리하는 것이다. 이 CDN 서버에는 해당 서비스 사이트의 각종 이미지, 기타 정적 요소들이 저장, 캐싱 되어..

PWA Progressive Web Apps are web apps that use emerging web browser APIs and features along with traditional progressive enhancement strategy to bring a native app-like user experience to cross-platform web applications. Progressive Web Apps are a useful design pattern, though they aren't a formalized standard. PWA can be thought of as similar to AJAX or other similar patterns that encompass a s..

Single Page Application html 문서 전체가 아니라 json 과 같은 포맷으로 서버에서 필요한 데이터만 받아올 수 있다. 이 데이터를 javascript 를 이용해 동적으로 html 요소를 생성해 페이지를 업데이트하는 방식이다. 이 방식이 AJAX 라는 이름으로 공식적으로 인정되는데, 이 것이 Single Page Application 이다. Table of Contents: Client Side Rendering(CSR) Server Side Rendering(SSR) TTV(Time To View) & TTI(Time To Interact) Static Site Generation(SSG) Conclusion Client Side Rendering(CSR) JS + Framewor..

Browser Rendering: JS + DOM + CSSOM There's a thing called the Critical Rendering Path (CRP), which is the pipeline for rendering a page. In other words, it's the steps the browser needs to take to create pixels into the screen from your HTML, CSS, and JavaScript code. Now, CSS and HTML are so-called render-blocking resources, meaning, they need to be fetched and fully parsed before we can rende..