전체 글147 [React] Optimization, useMemo, useCallback, memo - (1) 반갑습니다 ^^ 최근에는 chrome profiler 사용법을 익히고, 렌더링에 얼마나 걸리나 이런것들을 보는 재미로 지내고 있습니다. Profiler 보는법은 다음번에 포스팅을 해보도록 하겠습니다. 서론이 좀 길 수 있지만, 참고 읽어보시면 분명 도움이 될 것이라고 확신합니다. 일반적인 사람들의 오해 렌더링이 적으면 무조건 속도가 빠르다 -> React.memo 등 최적화를 위한 HOC나 hook들을 사용합니다. 하지만 이 말은 틀렸다고 생각합니다. 잘못된 케이스의 경우를 생각해보겠습니다. - deps가 어떻게 비교되어 작동되는지 모른다면, 무조건 렌더링이 되고, 비교함수도 호출 되므로 더 느려집니다. - 렌더링을 방지하려고 deps에서 비교하는 시간이 더 들 수 있습니다. 어떻게 사용해야 할까? 이미.. 2022. 3. 7. Chrome Performance Flame chart 색이 투명한경우 (Main탭) 오랜만입니다!! 성능 확인을 위해서 Performance를 뒤적거리던 중... 집 컴퓨터에서 Performance 탭에서 Script 실행시간을 보려고 하는데.. 글쎄 투명으로 나오는게 아닙니까.. 아니.. 뭘 보라는겁니까.. 그래서 시크릿 모드에서 확인해봤는데.. flame chart가 잘 나오는 것이었습니다.. 별것도 아닌데.. 오류를 찾는데 꽤 오랜시간이 걸렸습니다. 침착하게 옵션들을 비교했어야 하는데.. 해결법부터 알려드리겠습니다. chrome setting에서 저 WEBGL-based flamechart를 꺼야합니다.. 끄시고나서, 다시 크롬을 재 실행후 측정을 해보면 아래와 같이 다시 잘 나오는것을 확인할 수 있습니다. 온갖 검색어로 검색을 했지만.. 나오지 않아서... *어떻게 문제를 해결했.. 2022. 3. 1. [Clean Code] 13장. 동시성 13장. 동시성 동시성은 왜 필요한가? 결합(coupling)을 없애는 전략이다. 싱글스레드는 what, when이 밀접하다. 이것을 분리한다. 구조적 개선뿐만이 아닌 응답 시간(response time), 출력량(throughput)을 위해서도 필요하다. 메일 정보 수집기 한명씩만 처리하는 시스템 동시성의 미신과 오해 동시성은 성능을 높여준다 동시성은 때로 성능을 높여준다. 즉 항상 높여주는것은 아니다. 여러 스레드가 프로세서를 공유할 수 있거나, 여러 프로세서에서 동시에 처리할 독립적 계산이 많은 경우에만 성능이 높아진다. (일반적인 상황은 아님) 동시성을 구현해도 설계는 변하지 않는다(X) 싱글 스레드와, 다중 스레드는 설계가 다르다. what,when을 분리하면 시스템 구조가 크게 달라진다. 웹 .. 2022. 2. 25. [Clean Code] 12장. 창발성 12장. 창발성 (Emergence) 단순한 규칙 4가지로 우수한 설계가 나올 수 있게 할 수 있다 단순한 설계 규칙 4가지 모든 테스트를 실행한다 결합도가 높으면 테케를 작성하기가 어렵다. 결합도를 낮추려면 DI, 인터페이스, 추상화등을 이용 테스트가 가능한 시스템을 만들면 객체지향 방법론이 지향하는 목표를 저절로 달성할 수 있다. (SOLID) 리팩토링 TC를 모두 작성헀으면 코드를 점진적으로 리팩토링 할 수있다. 변화에 두렵지 않음. 시스템이 깨질까봐 두렵지 않음. side effect가 두렵지 않음. 중복을 없앤다 중복되는 로직이나 코드를 최대한 함수나 클래스로 빼자. TEMPLATE METHOD 패턴은 고차원 중복을 제거하는데 도움을 준다. 프로그래머 의도를 표현한다 코드는 개발자의 의도를 분명.. 2022. 2. 24. [Clean Code] 11장. 시스템 11장. 시스템 목차 도시를 세운다면? 도시는 각 분야를 관리하는 팀이 있기에 돌아갈 수 있다 깨끗한 코드를 구현하면 낮은 추상화 수준에서 관심사를 분리하기 쉬워진다 이 장에서는? 높은 추상화수준, 즉 시스템 수준에서도 깨끗함을 유지하는 방법을 보여준다 시스템 제작과 시스템 사용을 분리하라 제작(construction)과 사용(use)은 완전히 다르다. 건축물이 만들어질때의 모습과, 완성되어서 사용자가 사용할때의 모습은 완전히 다르다 소프트웨어 시스템은 (애플리케이션 객체를 제작하고 의존성을 서로 ‘연결’하는) 준비 과정 과 (준비과정 이후에 이어지는) 런타임 로직을 분리 해야한다. 런타임 로직과 준비 과정이 뒤섞여있는 예시 public Service getService() { if (service ==.. 2022. 2. 24. [Clean Code] 10장. 클래스 10장. 클래스 클래스 체계 변수 목록이 가장 먼저 나온다 우선순위 정리 (static, public 상수) → ( private 변수 ) → ( 비공개 인스턴스 ) 공개함수 비공개 함수는 공개 함수 직후에 넣는다 추상화 단계가 순차적으로 내려간다. 그래서 프로그램은 신문 기사 처럼 읽힌다. 캡슐화 변수와 유틸리티 함수는 최대한 공개하지 않는게 좋다. 하지만 반드시 숨겨야 할 이유도 없다 만약 같은 패키지 안에서 TC가 함수를 호출하거나, 변수를 사용해야 한다면, protected로 선언하거나, 패키지 전체로 공개한다 캡슐화를 풀어주는 결정은 언제나 최후의 수단이다 클래스는 작아야 한다 클래스를 만들때 가장 중요한것은 크기 이다. 작은것이 가장 중요하다! 함수는 물리적인 행의 수 클래스는 맡은 책임 의 .. 2022. 2. 23. [Clean Code] 9장. 단위테스트 단위테스트지만 TDD를 봤음. 9장. TDD TDD TDD법칙 3가지 실패하는 단위테스트를 작성할 때까지 실제 코드를 작성하지 않는다 컴파일은 실패하지 않으면서 실행이 실패하는 정도로만 단위 테스트를 작성한다. 현재 실패하는 테스트를 통과할 정도로만 실제 코드를 작성한다. 깨끗한 테스트코드 유지하기 테스트 코드는 실제 코드 못지 않게 중요하다 깨끗한 단위 테스트 코드로 짜면 된다. 그렇다면 깨끗한 테스트 코드를 만들려면 어떻게 해야할까? 가독성이 제일 중요하다. 최소의 표현으로 많은 것을 나타내야 한다. 테스트 환경은 자원이 제한적일 가능성이 낮으므로, 깨끗한 코드가 더 좋다. @Test public void turnOnCoolerAndBlowerIfTooHot() throws Exception { to.. 2022. 2. 23. [Clean Code] 8장. 경계 Clean Code 8장 (경계) 이곳에서의 경계는 클라이언트 코드와 외부 코드의 경계인것 같다. 외부 코드 사용하기 java.util.Map을 보면 굉장히 많은 인터페이스가 있다. clear(), equals() 등등.. 이것을 여기저기 넘긴다고 했을때, clear()는 어디서 불리더라도 맵에 있는 모든 값들이 삭제되는 문제가 생긴다. 경계 인터페이스인 Map을 seonsor 안으로 숨긴다. Seonsor 클래스에서 프로그램에 필요한 인터페이스만 제공한다. public class Sensors { private Map sensors = new HashMap(); public Sensor getById(String id) { return (Sensor) sensors.get(id); } } 항상 위와같이.. 2022. 2. 22. [Clean Code] 7장. 오류처리 Clean Code 7장 (오류 처리) 깨끗한 코드와 오류처리는 연관이 있다. 흩어진 오류처리 코드는 프로그램을 파악하기 어렵게 한다. 오류 코드보다 예외처리를 사용하라 모든 예외마다 if(handle != DeviceHandle.INVALID)처럼 다 확인하지 말자. try catch를 이용하자. 오류를 발생하면 예외를 던지는게 낫다. (오류처리문과 섞이지 않겟) Try-Catch-Finally 문부터 작성하라 먼저 try catch를 만든다. 강제로 예외를 발생시키는 TC를 작성후에 테스트를 통과하게 코드를 작성하는 방식이 권장된다. 장점 먼저 try block의 트랜잭션 범위부터 구현하게 되므로, 범위 내에서 트랜잭션 본질을 유지하기 쉬워진다. 정상 흐름을 정의하라 짧게 말해서, 무조건 try,ca.. 2022. 2. 21. [Clean Code] 6장. 객체와 자료구조 6장. 객체와 자료구조 Clean Code 6장 (객체와 자료구조) 변수를 비공개로 정의하는 이유는 뭘까? 남들이 변수에 의존하지 않게 만들기 위함이다. 충동이든 변덕이든, 변수타입이나 구현을 맘대로 바꾸고 싶어서다. 그러면 왜 getter,setter 함수를 public으로 만들어서 비공개 변수를 외부에 노출할까? 진정한 의미의 클래스는 추상 인터페이스를 제공해 사용자가 구현을 모른 채 자료의 핵심을 조작할 수 있어야 한다. // 구체적인 Vehicle 클래스 public interface Vehicle { double getFuelTankCapacity(); double getGallonsOfGasoline(); } // 추상적인 Vehicle 클래스 (더 좋다) public interface Veh.. 2022. 2. 21. 이전 1 2 3 4 5 6 7 8 ··· 15 다음 728x90
