반응형 전체 글110 [Konva] 유사 CAD 프로그램 제작 - 성능 향상의 기록 Web으로 편집 프로그램 제작을 위해서 회사에서 선택한 것은 Konva.js 왜 선택했는지에 대해서는 넘어가고, 이미 konva로 프로젝트를 진행중이고, 성능 개선이 필요하다면 읽어보면 좋을 것 같다. 문제 상황 사내용으로 만드는 유사 CAD 프로그램이었다. 한 번에 그려지는 객체수는 (1)약 5만개 이상 그리고 각 객체는 (2)위치 이동이 가능해야하며 독립적이지 않고 (3)연관되어 있다. 성능 이슈 작은 개수는 충분히 편집이 가능할 정도의 성능이 나왔다. 하지만, 5만개 정도면 한 번 움직이는데 수 초가 걸릴 정도로 성능이 저하되었다. 도저히 편집기로 사람이 쓸 수 없을 정도였다. 크게 세 가지로 정리하면 1. 대량의 데이터를 한 화면에 보여줄 것 2. 한 화면에서 편집이 가능할 것 3. 1, 2가 너.. WEB/JavaScript 2023. 11. 20. [Java] Thread - 바쁜 대기, Method이해하기, 주기적 실행 권한을 얻을 때까지 확인한다. Busy Waiting 주기적인 실행, 특정 시간 이후 실행 등의 작업을 하고 싶을 때는 Timer, TimerTask 같은 클래스를 활용도 고려해보자~ (java.util 에서 제공한다.) 동기화 문제와 바쁜 대기를 해결하여 구현되어 있다. 최근 Web으로 interactive하게 편집할 수 있는 편집기를 프로젝트로 진행하고 있다. 미리캔버스, Figma 등과 같은 느낌이라고 보면 될 것이다. 편집기에는 임시저장이 필수인데, 이를 구현하다보니 while을 사용한 무한루프로 특정 시간(10분)이 지날때마다 임시저장을 하도록 구현했다. Thread threadA = new Thread(()->{ while(flag){ if(LocalDateTime.now().getSecond.. 개념 2023. 10. 20. [React] BootStrap css가 적용되지 않을 때..! 공식 문서 Introduction | React Bootstrap Learn how to include React Bootstrap in your project. react-bootstrap.netlify.app 설치 정상완료 -> css만 적용안됨 아래 과정을 따라 bootstrap을 설치하면 component도 잘 불러와지지만, 정작 css는 적용되지 않는다. npm install react-bootstrap bootstrap 해결 최상단의 index.tsx에 아래와 같이 import를 해주면 바로 된다. import 'bootstrap/dist/css/bootstrap.css'; React-Bootstrap is a complete re-implementation of the Bootstrap co.. 카테고리 없음 2023. 10. 18. SQL/ 병행제어/ 로킹/ 교착상태(Dead Lock) SQL문 DDL - Data Definition Language . DB, Table, View, Index 등을 정의(생성, 삭제, 갱신)할 때 사용하며, CREATE, ALTER, DROP 등이 있다. . 도스테뷰인( Domain, Schema, Table, View, Index) - 인덱스 종료 . 순서 인덱스 : 데이터가 정렬된 순서대로 생성되는 인덱스 . 해시 인덱스 : 해시 함수에 의해 키 값으로 접근 . 비트맵 인덱스 : bit값인 0또는 1로 변환하여 인덱스 키로 사용 . 함수기반 인덱스 : 수식이나 함수 적용 . 단일 인덱스 : 하나의 컬럼으로만 구성 . 결합 인덱스 : 두개 이상의 컬럼으로 구성 . 클러스터드 인덱스 : 인덱스 키의 순서에 따라 데이터가 정렬되는 방식 : 검색빠름 . 넌.. 개념/정보처리기사 2023. 10. 3. [JavaScript] 즉시 실행함수/ 클로저 및 scope chaning 즉시 실행 함수 즉시 실행되는 함수 (function add(a, b){ console.log(a+b); }(3,4)); a, b라는 변수가 코드가 실행 후 사라지게 하고 싶을 경우, 즉시 실행함수 활용 -> 같은 변수명이 밖에서 사용되지 않았으면 좋겠을 경우, 활용하도록 한다. 호출없이 사용되기 때문에, framework에서 많이 사용된다. 클로저 디자인 패턴 중 하나로, javascript에는 접근제어자가 없기 때문에, 클로저를 활용하여 문제를 해결할 수 있다. ex) count -> java에서는 static private int count 선언하면 아주 간단히 해결 javascript에서는 function 내부에서 function을 return하도록 하여 return 된 function을 사용하도.. WEB/JavaScript 2023. 9. 6. [JavaScript] 기초 - 람다표기법(화살표 함수)/ for / 단축평가/ == vs === 자바스크립트에서는 함수를 매개변수로 전달한다.(Strategy Pattern과 유사하다. Java의 interface느낌으로) 함수를 표현하는 표기법 람다 표기법 = 화살표 함수 아래는 forEach를 실행하는 다양한 방법이다. var array = [100,200,300,400,500]; array.forEach(function(item){ console.log(item); }) for(var i of array){ console.log(i); } // in 키워드는 index를 가져옴 for(var i in array){ console.log(array[i]); } var log = function(i){ console.log(i); } var doc = function(item){ document... WEB/JavaScript 2023. 9. 6. 오늘의 기억 수정사항 0801 - 월 변경시 시간처리(0731 0801) - 기본값 설정 변경-> 종료 날짜 : 현재 날짜 -> 해당 기억의 날짜로 수정. ex) 0730~0801 -> 0730~0730 - 날짜 같을때만 시작시간 종료시간 설정 - 시간순 오름차순으로 보여주기. - 달력에서 week, twoweek, month설정 안보이게하기. 0808 - 자동 2시간 설정 수정 - 프로젝트/오늘의 기억 2023. 8. 1. [C언어] 포인터 관련 기본 예시 설명 *p+1 (*p) +1, p가 가리키는 메모리 내용에 1을 더함. *(p+1) 메모리 주소에 1* 자료형 크기를 더한 후 그 주소의 메모리 내용 참조 *p += 1 (*p)= (*p)+1; *p가 가리키는 값이 1커짐. *p++ *p로 현재 계산 진행 후 p++진행. (*p)++ p가 가리키는 메모리 내용 1 증가. *++p *(++p), p주소값 1 자료형만큼 증가 후, 그 내용 참조. ++*p ++(*p), p가 가리키는 메모리 내용 1 증가. 기본적인 문자열 처리 함수 함수 설명 char * strcpy(char* dest, const char* src) 문자열 복사함수 char * strcat(char * dest, const char* src); 문자열 추가. int strcmp(co.. 카테고리 없음 2023. 7. 29. [오늘의 기억] 개인정보처리방침 2023.11.29 모든 데이터는 클라우드 DB에 저장되며, 어플리케이션 이외의 용도로 사용되지 않습니다. 2023.07.23 모든 데이터는 사용자 기기에 저장되며, 다른 용도로 공유되거나 사용되지 않습니다. 프로젝트/오늘의 기억 2023. 7. 23. [Java] 소스코드 탐험 - 2. ArrayList(feat. AbstractList) 두번째로 볼 친구는 Iterator에 이은 ArrayList ArrayList를 살펴보니 상당하다. AbstractList를 상속하고 있으며, List, RandomAccess, Cloneable, Serializable을 구현하고 있다. public class ArrayList extends AbstractList implements List, RandomAccess, Cloneable, java.io.Serializable 먼저 여기서 살펴볼건 1. ArrayList가 가변크기를 어떻게 유지하는지? 2. 어떻게 동시 수정을 판단하는지. private static final int DEFAULT_CAPACITY = 10; transient Object[] elementData; * transient :.. Java 2023. 7. 23. [Java] 소스코드 탐험- Iterator 처음으로 살펴볼 소스코드는 Iterator. 주로 List, Set등 Collection 프레임 워크에서 특정 객체를 삭제하고 싶을 때 사용했었다. 자바 1.8부터 지원하는 removeif라는 method를 통해서 쉽게 없앨 수 있는데... 있는줄도 모르고 Iterator를 사용했었다. 쨋든 Iterator ㄱ.ㄱ public interface Iterator { boolean hasNext(); //원소가 더 있으면 true E next(); // 다음 원소 return, 원소가 더 없으면 NoSuchElementException 리턴 /** * The behavior of an iterator is unspecified if the underlying collection * is modified wh.. Java 2023. 7. 23. [Flutter] 플러터 vscode 개발 환경 세팅 잘 정리된 자료~! [Flutter] 플러터 vscode 개발 환경 구축 / 플러터 비주얼스튜디오 개발 환경 / 플러터 vscode 애뮬레이 VSCode에서 Flutter를 사용하기에 앞서, Flutter SDK 설치와 설정이 필요하다. 해당 부분은 아래의 글을 참고하고 설치가 완료되었다면 VSCode 설치를 진행한다. [Flutter] 플러터 개발환경 구축 및 세팅 [Flu parkjh7764.tistory.com 진행 시 아래와 같은 문제가 난다. flutter doctor --android-licenses Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installe.. 카테고리 없음 2023. 6. 29. 이전 1 2 3 4 5 6 ··· 10 다음 반응형