전체 글 94

번들 사이즈 이슈 해결(eslint,tsconfig)

개요웹 애플리케이션에서 초기 렌더링이 늦어지는 문제의 원인은 매우 다양하다. 이번에 해결한 이슈는 그 중 하나인 번들 사이즈 관련 문제이다. 일반적으로 개발자들은 다양한 오픈소스 번들러나, 경우에 따라서는 직접 개발한 번들러를 사용하여 자바스크립트 파일을 번들링한다. 그렇다면 왜 번들링 과정이 필요할까? 적절히 큰 규모의 프로젝트에서는 코드의 양이 수 기가바이트, 많으면 수십 기가바이트에 이를 수 있다. 사용자가 프로그램에 접속할 때 마다 모든 코드를 한 번에 가져오는 것은 현실적으로 부담이 너무 크기 때문에, 번들러에서는 이 과정에서 중복되는 코드 혹은 현재 상황에 필요 없는 코드를 제거하는 트리쉐이킹(Tree-shaking) 과정을 거친다. 이를 통해 큰 사이즈의 코드들을 아주 작은 단위로 줄여서 가..

builder 2024.07.24

Rollup(with swc plugin) 사용 시 트리 쉐이킹 문제 해결

회사의 번들링 결과 파일에서 중복된 Object.spread 함수가 생성되고 있는것을 확인하였다. 같은 번들임에도 중복 함수가 생성되고 있었으며 번들의 크기가 큰 경우 100~200개 까지도 중복 함수가 이름만 바뀌어 생성되는 것을 확인하였으며 이는 파일의 크기를 불필요하게 키우는 문제를 야기하기 때문에 이를 해결하기 위한 원인을 찾아보았다.문제 예시아래 예시는 중복된 _object_spread 함수들이 각각의 이름만 달리하여 생성된 예시이다.function _object_spread$3O(target) { for (var i = 1; i 원인중복된 _object_spread 함수의 생성 원인을 분석하기 위해 아래와 같은 코드를 작성하여 번들링을 진행해봤다.jsxCopy codeconst objec..

builder 2024.07.24

[AWS] IAM

IAM 기반 신분 관리AWS 계정을 처음 생성하면 root user가 만들어진다. root user는 모든 서비스와 리소스에 접근할 수 있으며, root user의 권한으로만 할 수 있는 작업들도 있다. AWS는 root user와 관련된 보안 위협을 방지하고 root user 대신 다른 계정을 생성하여 사용하는 것을 권장한다. 이를 위해 제공되는 서비스가 바로 IAM(Identity and Access Management)이다. IAM 정책IAM 정책은 하나 이상의 AWS 리소스에 대한 동작의 허용 여부를 결정하는 문서이다. 정책 문서에 명시되지 않은 동작은 모두 불허한다. 하나의 신분에는 최대 10개의 정책을 적용할 수 있다. 만약 하나의 정책에서 S3 버킷 생성을 허용하고 다른 정책에서 이를 불허한..

aws 2024.07.20

[AWS]데이터베이스 (2)

1편https://jjongsk.tistory.com/entry/AWS%EB%8D%B0%EC%9D%B4%ED%84%B0%EB%B2%A0%EC%9D%B4%EC%8A%A4-1 [AWS]데이터베이스 (1)관계형 데이터베이스관계형 데이터베이스는 최소 하나 이상의 테이블을 지닌다. 테이블은 열(col)과 행(row)으로 구성되며, 열은 속성(attribute), 행은 레코드(record) 또는 튜플(tuple)로 불린다. 각 열jjongsk.tistory.com  읽기 전용 복제본데이터베이스 인스턴스가 성능을 만족시키지 못할 때, 수직적 확장과 수평적 확장 옵션을 통해 성능을 개선할 수 있다.수직적 확장데이터베이스 운영 중 메모리, 컴퓨터 성능, 네트워크 속도, 디스크 처리용량 등의 문제가 발생하면, 데이터베이스..

aws 2024.07.18

[AWS]데이터베이스 (1)

관계형 데이터베이스관계형 데이터베이스는 최소 하나 이상의 테이블을 지닌다. 테이블은 열(col)과 행(row)으로 구성되며, 열은 속성(attribute), 행은 레코드(record) 또는 튜플(tuple)로 불린다. 각 열의 데이터는 미리 정의된 타입과 일치해야 하며, 이는 데이터 조회와 쿼리 작업을 유연하게 하는 장점이 있다. 또한 테이블 생성 후 필요에 따라 열을 추가하거나 삭제할 수 있다. 삭제 시에는 해당 열의 모든 데이터가 함께 삭제된다. 구조화 질의어 (SQL)사용자는 SQL(Structured Query Language)을 사용하여 데이터 저장, 조회, 유지 보수 작업을 수행한다. 이로 인해 관계형 DB를 SQL DB라고도 부른다. 문법은 각 RDBMS마다 다를 수 있다.데이터 조회SELE..

aws 2024.07.16

[AWS]VPC (2)

1편 링크https://jjongsk.tistory.com/entry/AWSVPC-1 [AWS]VPC (1)Amazon VPC 개요Amazon Virtual Private Cloud (VPC)는 AWS 클라우드에서 논리적으로 격리된 네트워크를 생성할 수 있도록 지원하는 서비스이다. VPC는 네트워크 계층에서 EC2 인스턴스와 기타 AWS 리소스를 포jjongsk.tistory.com 네트워크 주소 변환ENI와 퍼블릭 IP 주소를 연결한 뒤에도 ENI는 여전히 private IP 주소를 유지하며 새로운 설정이 필요 없다. 대신 NAT(Network Address Translation) 과정을 통해 인터넷 게이트웨이가 퍼블릭 IP 주소를 ENI의 private IP 주소로 매핑한다.NAT 디바이스네트워크 주..

aws 2024.07.13

[AWS]VPC (1)

Amazon VPC 개요Amazon Virtual Private Cloud (VPC)는 AWS 클라우드에서 논리적으로 격리된 네트워크를 생성할 수 있도록 지원하는 서비스이다. VPC는 네트워크 계층에서 EC2 인스턴스와 기타 AWS 리소스를 포함할 수 있게 도와준다. VPC는 단일 AWS 리전 내에서만 존재할 수 있으며, 네트워크 하드웨어를 사용하지 않고 소프트웨어 기능을 통해 라우터, 스위치, VLAN 등을 추상화하여 제공한다. VPC CIDR 블록CIDR 블록은 VPC 내의 인스턴스 및 리소스에 할당되는 IP 주소를 결정한다.AWS에서 사용 가능한 CIDR 범위10.0.0.0 ~ 10.255.255.255 (10.0.0.0/8)172.16.0.0 ~ 172.31.255.255 (172.16.0.0/1..

aws 2024.07.09

트랜잭션과 고립(격리)수준

트랜잭션이란 무엇인가?DBMS에서 데이터를 다루는 논리적인 작업의 단위트랜잭션의 필요성데이터 복구: 데이터베이스 작업 도중 장애가 발생하면 데이터를 복구하기 위한 단위작업 분리: 여러 작업이 동시에 같은 데이터를 다룰 때 발생할 수 있는 문제를 방지하기 위해 작업을 분리하는 단위예시 (ACID)1. A에서 B계좌로 돈을 입금할 때 → B계좌의 입금 관련 쓰기 작업에 실패 시[Atomicity(원자성)]트랜잭션이 제대로 되어있지 않다면 A계좌에서 출금한 돈은 없어지게 되어버리며 하나의 트랜잭션이서 두 개의 작업을 실행하고 있을 때 하나의 작업이라도 실패 시 모든 작업이 실패로 돌아가야 함 → 기존 데이터로 롤백 시키는 작업을 해야함2. 잔액이 1000원 밖에 없는 A계좌에서 B,C 계좌로 동시에 1000원..

database 2024.07.07

기존 빌더와의 호환성 검증을 위한 통합 테스트코드 작성

개요최근 레포지토리가 점점 커지면서 파일의 증가로 인해 전체 빌드 시 간간히 메모리 초과 문제가 발생하여, 빌드 시스템을 리팩토링하는 작업을 진행하였다. 이 빌더는 약 150명의 개발자가 사용하는 회사 전체 프로젝트 배포에 사용되므로, 기존 빌더와의 완벽한 호환성을 유지하는 것이 1순위 목표였고 개발 자체는 후순위였다. 따라서, 테스트 코드를 통해 기존 빌더와의 동기화 유무를 확실하게 잡고 개발을 시작하기로 하였다. 빌더는 내부에서 child_process를 사용하여 멀티 프로세서 환경에서 tsc를 사용한 컴파일과 rollup을 사용한 번들링 과정을 거쳐 빌드 파일을 생성하는 방식으로 동작하고 있었다. 단위 테스트보다는 결과 파일이 동일한지를 확인하는 것이 중요했기 때문에 빌더를 실행 시킨 뒤 최종 결과..

etc 2024.07.03