분류 전체보기149 [일상] React.js에 Contribute 성공.. (눈물흘리며 쓰는중) w오늘 그냥 펑펑 눈물을 쏟았습니다.... 별건 아니지만.. React.js에 기여에 성공했습니다. 아직 오타나 찾는 그런 미세먼지급 기여이지만... clone해서 직접 실행시켜가면서 확인 후에 올렸는데, 굉장히 재미있는 경험이었습니다. (pr 올리고 기분이 좋아서 공부를 못했습니다) 제가.. 드디어 많은 사람들과 한 배를 타게 되었습니다.. 제 깃허브에도 올라갔습니다... 현재 제 스펙 MDN 기여 2회 {1번은 mdn 번역 용어집 수정 (매우 훌륭) } React.js 기여 1회 (오타 수정) 다음번에는 React.js의 결함을 찾아내서 컨트리뷰트 하는 사람이 되어야 겠습니다. 주변에 이런거 말하면 들어줄 사람이 없어서.. 불특정 익명 다수에게 자랑합니다 크하하 감사합니다^^ 2022. 5. 5. [React] Optimization, useMemo, useCallback, memo - (2) 반갑습니다 ^^ 2탄을 이어서 작성해 보겠습니다. React.memo는 컴포넌트를 넣으면 컴포넌트를 반환해주는 함수인데요. (HOC) 이것들에 대한 설명을 찾아보면, memo는 props를 비교하고 얕은 비교를 한다. 이런 설명이 전부입니다. 이렇게만 알고 가면, 이 케이스에는 렌더링이 일어날까? 이런 것들이 대한 답이 되지 않았습니다. 제가 직접 찾아보고 나니 이제는 대답을 할 수 있을것 같더라구요. memo에 props를 50개를 넣었지만, 실제로 호출시에 3개만 넘겨준다면, 그 3개만 비교하게 될 것입니다. React.memo 이 HOC는 주어진 props를 비교하지만 좀 더 자세히 비교를 합니다. 그리고 시간이 꽤나 걸릴것 같은 작업입니다. areHookEquals보다 가격이 훨씬 비싸답니다. d.. 2022. 3. 9. [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. 이전 1 2 3 4 5 6 7 8 ··· 15 다음 728x90
