본문 바로가기

프로그래밍 놀이터/Web175

[web network] inlining 이란? [web network] inlining 이란? -웹 사이트에 접속하면 browser 는 먼저 HTML 을 다운받는다.그리고 HTML 을 순차적으로 읽어가며, image, js, css 등을 다운받는다. 이 때 css, js 등의 파일을 전체를 다운받을 경우 느린 인터넷 환경에서는 overhead 가 될 수 있기 때문에, ( 물론 최초 loading 이후에는 cache 를 사용할 테지만.. )자주 쓰이는 코드나, 빨리 load 되어야 하는 코드는 HTML 안에 내용을 넣을 수 있다. 이것이 inline 이다. -css 파일을 async 하게 로딩하거나, footer 쪽에서 loading 하므로써 추가적인 성능 향상도 꾀할 수 있다. -Font file 을 stylesheet 에 base64 encodin.. 2018. 5. 11.
[web network] Domain Sharding 이란? [web network] Domain Sharding 이란? 참조 : https://www.maxcdn.com/one/visual-glossary/domain-sharding-2/ -sharding 이라는 것은 “조각, 파편” 이라는 뜻. -Domain sharding 은 resource 를 여러 개의 domain 으로 나누어 저장하여,page load time 을 향상시키는 일종의 트릭 혹은 방법이다. 여러 개의 domain 으로 나누어진 리소스를 다운받기 때문에 browser 는 더 많은 리소스를 한번에 더 많이 받을 수 있다. -Domain sharding 을 적용하는 이유는 대부분의 web browser 가 한개의 domain 에 대해 active connection 을 제한하기 때문이다.예를 들.. 2018. 5. 10.
[network] SNI ( Server Name Indication ) [network] SNI ( Server Name Indication ) -SNI 는 Server Name Indication 의 약자 -TLS 의 확장 protocol 로, client 가 handshaking 단계에서 hostname 을 명시할 수 있게 하는 규약이다. -SNI 를 사용하게 되면 한 IP 에서 여러 host 를 제공하는 virtual host 환경에서,각각의 virtual host 가 각각의 certificate 를 지원할 수 있다는 보안적 장점이 있다. SNI 가 지원되지 않으면, Name-based virtual host( 한개의 IP ) 에서는 하나의 인증서만을 사용해야 했다. -SNI 를 지원하는 브라우저를 쓰지 않는다면, virtual host 에 접속하는 경우 browser.. 2018. 5. 9.
[Network] 가상 호스트란 ( Virtual Host ) ? [Network] 가상 호스트란 ( Virtual Host ) ? 참조 : https://www.linux.co.kr/apache/virtualhost/page02.htm -웹 서버에는 기본적으로 존재하는 호스트가 있다.이를 웹 서버의 메인 호스트 (Main host)라고 한다. -하나의 웹 서버에는 주 호스트 외에 별도의 홈 디렉토리를 가진 여러개의 호스트를 설정하여 운용할 수 있다.주로 웹호스팅 서비스에 사용되며, 메인 호스트 외의 호스트들을 모두 가상 호스트( Virtual Host )라고 한다. -가상 호스트 운용 방식은 다음과 같이 할 수 있다. 이름 기반 가상호스트 ( Name-based virtual host ) 주소 기반 가상 호스트 ( IP-based virtual host ) 포트 기반.. 2018. 5. 8.
AMP HTML 어떤 녀석일까? AMP HTML 어떤 녀석일까? http://hackya.com/kr/amp-html-%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%9D%BC%EB%A9%B4-%EC%A7%80%EA%B8%88-%EA%BC%AD-%EC%9D%B5%ED%98%80%EC%95%BC-%ED%95%98%EB%8A%94-%EC%83%88%EB%A1%9C%EC%9A%B4-%ED%94%8C%EB%9E%AB%ED%8F%BC/ https://www.ampproject.org/how-it-works/ -Advanced Mobile Pages HTML 의 약자. -웹이 애플과 페이스북의 플랫폼으로 종속되는 현상을 막고자구글이 주도해서 개발한(~ing) 새로운 플랫폼. -웹의 플랫폼 종속이라는 이야기는..컨텐츠와 기술을 가진 기업들이.. 2018. 5. 7.
[web network] SPDY ( 스피디 ) [web network] SPDY ( 스피디 ) Wikihttp://d2.naver.com/helloworld/140351http://www.slideshare.net/oddpoet/spdy-13231459 -두문자어가 아니며, Speedy 를 기반으로 구글이 만든 단어이다.스피디 라고 읽는다. -구글이 개발한 비표준 개방형 네트워크 프로토콜이다. ( HTTP 2.0 에 들어갈 예정 ) -SPDY 가 등장한 배경은 다음과 같다. 더 많은 리소스 다수의 도메인 동적 동작 보안이 중요한 이슈 -웹 페이지 부하 레이턴시를 줄이고, 웹 보안을 개선한다.압축, 다중화(Multiplexing, Pipiline 과는 다르다), 우선 순위 설정을 통해 레이턴시를 감소한다. -하나의 소켓 연결을 통해 페이지를 구성하는 .. 2018. 5. 6.
어떻게 contents 를 vertical 중앙 정렬 시킬 것인가? ( vertical-align 에 대한 오해 ) 어떻게 contents 를 vertical 중앙 정렬 시킬 것인가? ( vertical-align 에 대한 오해 ) 출처 : http://phrogz.net/CSS/vertical-align/index.html table cell 에서의 vertical-align -css 의 vertical-align 이 valign attribute 와 비슷하게 작동한다.최신 browser 에서는 아래 3개의 코드가 똑같이 작동한다. inline element 에서의 vertical-align -inline element 에서는 align 처럼 작동한다.최신 browser 에서는 아래 3개의 코드가 똑같이 작동한다. 다른 element 에서의 vertically-center 는? -다른 element 에서는 사실 이 .. 2016. 4. 30.
millisecond to date / date to millisecond converter MilliSecond To Date Converter 2015. 2. 5.
Chap 16. 표준 태그 라이브러리 ( JSTL ) Chap 16. 표준 태그 라이브러리 ( JSTL ) 개발자가 직접 와 같은 태그를 작성할 수 있는 기능을 제공하는데 이를 커스텀 태그라고 한다.커스텀 태그 중에서 많이 사용되는 것들을 모아서 JSTL( JSP Standard Tag Library ) 라는 규약을 만들었다. * JSTL 이란? JSP 는 스크립트릿과 표현식 등의 스크립트 코드와 HTML 코드가 뒤섞이게 되는데, 이렇게 뒤섞인 JSP 코드는 알아보기 쉽지 않다. { } 같은 녀석들이 뒤섞이기 때문이다. 와 같은 기능을 하는 하는 태그를 프로그래머가 만들 수 있는데 이것이 커스텀 태그이다.이 중 JSP 페이지에서 많이 사용되는 논리적인 판단, 반복문의 처리, 데이터베이스 등의 처리를 위한 표준 커스텀 태그가 JSTL 이다. -JSTL 이 제.. 2015. 1. 22.