본문 바로가기
[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.
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.
[Django] 파이썬 웹 프로그래밍 - 웹 프로그래밍의 이해 [Django] 파이썬 웹 프로그래밍 - 웹 프로그래밍의 이해 -책을 읽으며 Remind 하는 내용, 핵심 내용, 모르던 내용을 정리한 것입니다. 예문 및 자세한 설명은 책을 구매하여 보세요~ * 1.2.1. 웹 브라우저를 사용하여 요청 * 1.2.2. 리눅스 curl 명령을 사용하여 요청 -curl 명령은 HTTP/HTTPS/FTP 등 여러 가지의 프로토콜을 사용하여 데이터를 송 수신할 수 있는 명령이다. * 1.2.3. Telnet 을 사용하여 요청 -telnet 명령은 터미널 창에서 입력하는 내용을 그대로 웹 서버에 전송한다.telnet 명령모드에서 나가려면 아래 두 라인을 입력해야 한다. ^] ( Ctrl + ] )quit .. 2016. 12. 6.
JSON 과 XML 의 Parsing 비교. ( 속도, 특성, 장단점 ) JSON 과 XML 의 Parsing 비교. ( 속도, 특성, 장단점 ) General -Transfer, Parsing, Query 측면에서 봤을 때 XML 과 JSON 은 거의 비슷하다.( 33 개의 다른 문서를 1200 번정도 OS, Browser 등을 바꿔가며 테스트 했다고 함 ) 출처 : http://www.infoq.com/news/2013/08/xml-json-performance -기본 JavaScript parsing 기준으로 JSON 이 XML 보다 조금 더 느리지만, query 속도는 JSON 이 훨씬 빠르다.jQuery 를 이용했을 경우에는 JSON 이 매우 느려지는데, XML 은 훨~씬 느려진다. -JSON, XML 파싱 속도는 큰 차이가 없으니, 그냥 Data 전송에 치우쳐 생각.. 2014. 4. 2.
[android] JavaScript Bridge android, JavaScript Bridge JavaScript Bridge 하이브리드 앱을 만들 때 사용되는 방식으로, HTML 에서 어떤 function call 을 하면 android webview 에서 catch 가능하다. WebView.setJavaScriptEnabled( true );WebView.addJavascriptInterface( new MyBridge(), "AppInterface" ); private class MyBridge{public void functionName( String arg ){// do sth..}} function callAndroidFunction(){window.AppInterface.functionName();} 반대로 App 에서 JavaScrip.. 2014. 3. 17.
[기초강좌] HTML Head - w3schools 번역 [기초강좌] HTML Head - w3schools 번역 w3school 의 강좌 내용을 번역한 글입니다. 원문 : http://www.w3schools.com/html/html_head.asp The HTML The content of the document...... The HTML Element tag 는 페이지 안에 있는 모든 상대경로 URL 의 기본 URL 그리고 기본 target 을 정의한다. The HTML Element tag 는 문서와 외부 리소스와의 관계를 정의한다. tag 는 대부분 style sheet 을 연결할 때 사용된다. The HTML Element tag 는 HTML 문서의 style 정보를 정의하는 데 사용된다. element 안에는 HTML element 들이 어떻게 그.. 2014. 3. 10.
[CSS] Bootstrap Tutorial #1 - download & setup CSS, Bootstrap Tutorial #1 - download & setup Download and understand file structures 다운로드 https://github.com/twbs/bootstrap/archive/v3.0.0.zip 메인 css 파일인 bootstrap.css 와 bootstrap-min.css 은 dist/css 에 들어있다. 메인 js 파일인 bootstrap.js 와 bootstrap-min.js 는 dist/js 에 들어이다. root 에 있는 js 폴더는 다른 js plug-in 들이다.asset/js 폴더에는 html5shiv.js 와 respond.min.js 가 들어있다.이것들은 IE8 을 support 하는 녀석들이다. asset/js 에는 jqu.. 2014. 2. 8.
반응형

티스토리툴바