목록웹 (17)
개발블로그
HTTP (HyperText Transfer Protocol) 웹상에서 클라이언트와 서버간의 통신을 위한 프로토콜, TCP connection을 기반으로 동작한다. HTTP/1.1 connection 하나당 하나의 resquest/response를 처리한다. 그렇기 때문에 동시전송과 다수 리소스 처리에 대한 속도 및 성능에 대한 이슈를 가진다. HOLB (Head Of Line Blocking) 같은 큐에 있는 패킷이 첫번째(head of line) 패킷에 의해 지연될 때 발생하는 성능 저하 현상 piplining 기법을 통해 하나의 connection을 통하여 다수의 파일을 요청/응답 할 수 있다. 이를 통해 성능 향상을 꾀할 수 있으나 문제점이 존재한다. 클라이언트에서 3개의 이미지를 요청한다고 가정..
1. React Native: 웹 개발자가 한달만에 앱 출시하기 (발표자료: https://www.slideshare.net/deview/121react-native) React Native Facebook, Instagram, Discord 등 많은 플랫폼에서 React Native가 사용되고 있다. 네이티브 앱에서 React Native로 전환한 후 많은 덕을 보았다. 빠른 개발속도, 98%에 육박하는 iOS, Android간의 코드 공유 등 탁월한 선택이라고 이야기함. React Native의 장점은 투입한 개발 리소스에 비해 결과물의 퀄리티가 좋다는 점과 플랫폼간 공유 코드를 생성함으로써 유지 보수비용이 낮아진다는 점이다. ‘단 기간에 프로덕션 레벨의 크로스 플랫폼을 만들어야 할 때 고려할 수 있..
A Promise is an object representing the eventual completion or failure of an asynchronous operation. — (출처: MDN) ‘Promise는 비동기 작업의 최종 완료나 실패를 표현하는 객체이다.’ 쯤으로 해석된다. Promise에 대해서 보기 전에 ‘비동기 작업’에 대하여 알아보도록 하자. Asynchronous 자바스크립트는 single-thread로 동작한다. 쉽게 말하자면 하나씩 하나씩 순차적으로 처리해 나간다는 말이다. 그림을 보자. 사용자의 동작에 의해서 이벤트가 발생하고, 그 이벤트는 메시지 큐에 담긴다. 큐의 맨 앞 이벤트가 실행될 때, 호출스택에 이벤트에 해당하는 함수들이 쌓이고, 순차적으로 처리된다. 전부 다 ..
JavaScript에서의 this In most cases, the value of this is determined by how a function is called. It can't be set by assignment during execution, and it may be different each time the function is called - 출처 : MDN( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this ) 자바스크립트에서 함수의 this키워드는 다른 언어에서의 this와는 조금 다르다고 한다. 대부분의 경우에 this는 함수가 어떻게 불렸냐에 따라 결정되는데, 실행중 할당에 의해 정해질 ..
ES6부터 자바스크립트에도 클래스개념이 도입되었다고 한다. C나 JAVA에서 봐왔던, 내가 알던 클래스와는 조금 다르기에 정리해 보려고 한다. 클래스를 사용해보자! // define Person class class Person { constructor(name, age, email) { this.name = name; this.age = age; this.emailList = email ? [email] : []; } introducMyself() { return `I'm ${this.name}, ${this.age}years old.`; } // Getter Method get getEmailList() { return `Email : ${this.emailList.join(', ')}`; } // ..
MyObject.prototype.myMethod = function() {…}; 프로토타입을 처음 접했을 때 제일 궁금했던 점은 ‘왜 함수 내부에 메소드나 변수를 정의하나, prototype을 사용하여 정의하나 똑같은거 아닌가?’ 였다. 이 궁금증에 대한 해답을 찾았다. // without Prototype function MyClass(name) { this.name = name; this.sayMyName = function() { console.log(this.name); } } var MyClass1 = new A("I'm MyClass1"); var MyClass2 = new A("I'm MyClass2"); console.log(MyClass1.sayMyName === MyClass2.say..