Javascript 로 웹 풀스택 개발하면서 새롭게 느낀점

2017-10-13 11:28

안녕하세요,
이번에 처음으로 JS로 웹 풀스택(JS,NodeJS,MongoDB) 개발하면서 느낀점이 많아 한번 적어봅니다.
제가 틀린부분도 있을수도 있으니 잘못된 점은 질타 부탁드립니다.
요점 중심으로 정리한거라 반어체를 사용한 점 미리 사과드립니다.

  1. 재사용할 목적으로 HTML Element 에 데이터를 저장하지 말자.
    무겁고 생각보다 리소스를 많이 사용한다.
    Element를 렌더링하고 다시 파싱하는게 다 리소스다.
    Javascript 에서 가지고 있자.

  2. 화면과 화면 사이의 데이터 이동은 자체정의한 이벤트를 통해서 전송하자.
    결합도가 낮아지고 소스가 보다 깔끔하다.

  3. 자주쓰는 모듈 메서드는 로컬 변수를 선언해서 쉽게 접근하게 하자.
    Don't repeat your self.
    배열의 길이를 미리 변수에 저장한다든지, 특정 Element 나 모듈의 접근을
    로컬 변수로 미리 지정하자.

  4. JS 나 Element 에서 Element 의 Style을 정의 하지 말자.
    CSS에서 미리 정의하고
    addClass, removeClass 로 소스를 깔끔하게 하자.

  5. JS 로 화면을 그릴 때 랜더링이 최소한 적게 발생하도록 하자.
    JS 상 Element 를 생성을 완료 후에 한번에 appendChild 나 innerHTML으로 추가 하자.
    랜더링 도 비용이 많이 든다.
    CSS 적용도 마찬가지다.
    최소한 랜더링이 적게 발생하게 하고 머신이 작업을 적게 하자.

  6. 브라우저, 서버가 하드웨어로 어떻게 작동할지 고민도 해보자.
    for 문과 같은 반복작업에서 로컬메서드내에서 작업하다가
    안드로메다 까지 갔다오는 작업은 되도록이면 피하자.
    하드웨어, 메모리 작동하는거 생각하면서 개발하자.

  7. JS 가 충분히 매력적인 언어다.
    하지만 쉬운만큼 잘못 알고 사용 할 수 있으므로 많이 공부해야 한다.
    JS는 JS로 생각하자. 어슬프게 Java 객체와 비교하면서 이해하려고 하지말자.
    버전에 따라서 this 가 달리 작동될수 있다.

  8. Event Driven 으로 개발하자.
    Flex(Action Script) 와 너무 비슷하다.

  9. 너무 많은 Event listener 를 활성하지 말자.
    event listener도 비용이 생각보다 많이 든다.
    상위 엘리멘트에서 Event를 listener 를 추가하고 분기를 태워도 충분하다.
    특히 반복되는 UL 나 Table에서는 각 LI, TD 마다 listener 를 하나씩 추가하는게 아니라
    UL 이나 Table 에서 하나면 충분하다.

  10. addEventListener 후 removeEventListener 도 잊지 말자.
    eventListener은 가비지 컬렉션에 의해 회수 되지 않는다.
    수동으로 제거 하자.

  11. 더이상 사용하지 않는 object 변수는 null 처리 하자.

1개의 의견 from SLiPP

의견 추가하기

연관태그

← 목록으로