반응형 개발/브라우저와 네트워크29 CSR과 SSR SSR vs CSR SSR(Server Side Rendering) : 웹 페이지를 서버에서 렌더링한다. 서버는 정해진 렌더링 준비가 완료된 페이지를 브라우저에 전송한다. 웹 페이지의 내용에 데이터베이스의 데이터가 필요한 경우, 서버는 데이터베이스의 데이터를 불러온 다음 웹 페이지를 완전히 렌더링 된 페이지로 변환한 후에 브라우저로 응답을 보낸다. 브라우저가 다른 경로로 이동할때마다 서버는 같은 작업을 반복한다. -> 서버 부하가 커진다. CSR(Client Side Rendering) : 클라이언트에서 페이지를 렌더링한다. 브라우저의 요청을 서버로 보내면 서버는 웹 페이지의 골격과 JS를 클라이언트에 보낸다. 웹 페이지와 함께 전달된 JS 파일은 브라우저에서 완전히 렌더링 된다. 웹 페이지에 데이터베이.. 2021. 9. 29. URL:QueryString과 Params Querystring GET /airport?code={query} /airport?code=ICN 아래 코드와 브라우저 주소창에 타이핑한 결과를 살펴보자 const express = require('express'); const router = express.Router(); //[GET] /airport?code={query} 요청을 수행한다. router.get('/airport', function (req, res) { console.log("공항 코드는 " + req.query.code + " 입니다") res.send("code : " + req.query.code) }); req.query.code = {query} 와 주소창에 타이핑한 localhost:3001/airport?code=ic.. 2021. 9. 26. 웹의 동작 원리 검색하다 잘 정리된 그림을 찾았다. Google을 검색했을 때 일어나는 일 참고 : https://devjin-blog.com/what-happen-browser-search/ https://medium.com/@1087/what-happens-when-you-type-you-type-google-com-in-your-browser-and-hit-enter-fb60455b95eehttps://victorydntmd.tistory.com/288 1 . www.google.com을 주소창에 친다 2. HSTS 목록을 확인한다. 목록에 해당 url이 있다면 HTTPS로 통신한다. 3. 캐싱된 DNS 기록을 통해 www.google.com에 대응되는 IP 주소가 있는지 확인한다. 캐시는 리소스의 복사본을 저장하.. 2021. 9. 25. HTTP cache mdn 캐시를 읽고 부분정리한 내용이다. 캐싱 캐싱은 리소스의 복사본을 저장하고 있다가 요청시 제공하는 기술이다. -> 캐싱을 통해 서버거 모든 클라이언트를 서비스 할 필요가 없어지고 서버의 부하가 완화된다. -> 캐시가 원래 서버보다 가까이 있으므로 리소스 회신 시간이 짧아지고 성능이 향상된다. 주의 : 모든 리소스가 불변하지 않으므로 , 리소스가 변경된 이후에는 더이상 캐싱하지 않아야 한다. Private browser caches (사설 브라우저 캐시) 단일 사용자를 위한 것이다. 브라우저 캐시는 사용자가 HTTP를 통해 다운로드한 모든 documents를 보관한다. Private browser caches는 방문한 documents들을 뒤로가기, 앞으로가기, 저장 등을 위해 사용할 수 있게 해준다.. 2021. 9. 24. 이전 1 ··· 4 5 6 7 8 다음 반응형
