[React] Front-End

[WEB] JavaScript : 객체 / js파일쪼개기 / 라이브러리와 프레임워크

ddgoori 2019. 8. 3. 00:28

객체

- 객체는 정리정돈의 수단

- 많아진 코드를 잘 정리하기 위해서 => 함수를 씀

- 함수와 함수와 연관된 변수들이 많아지면

같은 이름으로 그룹핑해서 잘 정리정돈 하기위한 도구 => 객체

- 배열은 정보를 담는 그릇이면서 순서대로 정보가 저장됨

- 객체는 이름이 있는 정리정돈 상자

 

- 객체에 속해 있는 함수 == 메소드(method)

- 객체에 속해 있는 변수 == 프로퍼티(property)

 

 

JS파일 추가

JS파일로 쪼개는 것이 효율적이고 시간도 돈도 적게 드는 방법임

- 웹페이지를 로드할 떄 js, html, 2번 로그인 해야한다

- 웹서버 입장에서 나쁜 일 => 접속은 적을 수록 좋아서

- 그럼에도 불구하게 이렇게 파일을 쪼개는 것이 훨씬 좋음

- WHY? 캐시 때문에. 

- 한번 웹 브라우저에 다운된 파일은 웹 브라우저가 보통 컴퓨터에 저장함

- 그래서 다음에 접속할 때 저장된 파일을 읽어서 네트워크를 거치지 않도록 해줌

- 서버 입장 : 비용 절감 가능 / 사용자 입장 : 네트워크 트래픽 절감 및 빠르게 볼 수 있어서 좋음

 

https://cyberx.tistory.com/9

 

더 빠른 웹을 위하여 - 웹 캐쉬 (WEB CACHE)

WEB-CACHE (TIME-SPACE TRADEOFF) 더 빠른 웹사이트를 위해 저희 개발자들은 눈물겨운 노력을 많이 합니다. - WebCache - Code Compressing - Image Optimizing - Image Spriting - Critical Rendering Path - We..

cyberx.tistory.com

 

라이브러리와 프레임워크

 

*공통점 : 다른 사람의 도움을 받아서 소프트웨어를 만든다는 점

 

*라이브러리 : 무언가가 정리정돈된 곳 = 도서관

내가 만들고자 하는 프로그램에 필요한 부품들이 정리되어 있는 소프트웨어

땡겨와서 쓰는 느낌

 

*프레임워크 : 우리가 만들고자 하는 곳이 있을 때, 만들고자 하는 것이 무엇이냐에 따라서

그것을 만들려고 할때,  프레임워크 안에 들어가서 쓰는 느낌

=> 우리가 만들고자 하는 것을 처음부터 끝까지 만들지 않도록 해주는 반제품과 같은 것

 

 

라이브러리

 

- 자바스크립트 라이브러리 중 가장 유명한 라이브러리 : 제이쿼리 JQuery

- CDN은 우리가 가져다 쓰는 것

https://developers.google.com/speed/libraries/#jquery

 

Hosted Libraries  |  Hosted Libraries  |  Google Developers

A stable, reliable, high-speed, globally available content distribution network for the most popular open-source JavaScript libraries.

developers.google.com

- 제이쿼리는 새로운 언어 X

- 자바스크립트를 이용해서 CSS를 만들어 놓은 것

- 수 많은 라이브러리 들이 쏟아지는 세상

- 세상에 어떤 라이브러리가 있는지 많이 일 수록 많은 일을 할 수 있다.