V8 JS Optimization Tip

특히 array가 중요한데, 하나의 array에는 하나의 type만 넣어주는 것이 최고

1. 객체 속성의 순서: 객체 속성을 항상 같은 순서로 초기화해서 히든클래스 및 이후에 생성되는 최적화 코드가 공유될 수 있도록 합니다

2. 동적 속성: 객체 생성 이후에 속성을 추가하는 것은 히든 클래스가 변하도록 강제하고 이전의 히든클래스를 대상으로 최적화되었던 모든 메소드를 느리게 만듭니다. 대신에 모든 객체의 속성을 생성자에서 할당합니다

3. 메소드: 동일한 메소드를 반복적으로 수행하는 코드가 서로 다른 메소드를 한 번씩만 수행하는 코드 보다 더 빠르게 동작합니다(인라인 캐싱 때문)

4. 배열: 값이 띄엄띄엄 있어서 키가 계속해서 증가하는 숫자가 되지 않는 배열은 피하는게 좋습니다. 모든 요소를 가지지는 않는 배열은 해시테이블입니다.
1. 배열의 요소들은 접근하기에 많은 비용이 듭니다.
2. 또한 커다란 배열을 미리 할당하지 않도록 하십시오. 사용하면서 크기가 커지도록 하는 게 낫습니다
3. 마지막으로 배열의 요소를 삭제하지 마십시오. 그 배열의 키가 띄엄띄엄 배치됩니다

5. 태깅된 값: V8은 객체와 숫자를 32비트로 표현합니다. 어떤 값이 오브젝트(flag = 1)인지 혹은 정수(flag = 0)인지는 SMI(Small Integer)라는 하나의 비트에 저장하고 이 때문에 31비트가 남습니다. 따라서 어떤 숫자가 31비트 보다 크면 V8은 이 숫자를 분리해서 더블 타입으로 전환한 다음 이 숫자를 넣을 새로운 객체를 생성합니다. 이러한 동작은 비용이 높으므로
1. 가능한한 31비트의 숫자를 사용하도록 하십시오.

자바스크립트 엔진의 최적화 기법 (1) - JITC, Adaptive Compilation : NHN Cloud Meetup

자바스크립트 엔진의 최적화 기법 (1) - JITC, Adaptive Compilation

https://meetup.toast.com/posts/77

자바스크립트는 어떻게 작동하는가: V8 엔진의 내부 + 최적화된 코드를 작성을 위한 다섯 가지 팁

몇 주 전 우리는 자바스크립트를 좀 더 깊이 살펴 보고 실제로 어떻게 작동하는지 알아보는 시리즈를 시작했습니다. 이 시리즈의 동기는 자바스크립트가 무엇으로 구성되어 있고 그 구성요소가 어떻게 맞물려 작동하는지 더 잘 알면 더 나은 코드와 앱을 작성할 수 있다는 생각이었습니다. 시리즈의 첫 번째 글은 엔진, 런타임, 콜스택의 개관에 초점을 맞췄습니다. 이...

https://engineering.huiseoul.com/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-%EC%9E%91%EB%8F%99%ED%95%98%EB%8A%94%EA%B0%80-v8-%EC%97%94%EC%A7%84%EC%9D%98-%EB%82%B4%EB%B6%80-%EC%B5%9C%EC%A0%81%ED%99%94%EB%90%9C-%EC%BD%94%EB%93%9C%EB%A5%BC-%EC%9E%91%EC%84%B1%EC%9D%84-%EC%9C%84%ED%95%9C-%EB%8B%A4%EC%84%AF-%EA%B0%80%EC%A7%80-%ED%8C%81-6c6f9832c1d9

자바스크립트는 어떻게 작동하는가: V8 엔진의 내부 + 최적화된 코드를 작성을 위한 다섯 가지 팁

몇 주 전 우리는 자바스크립트를 좀 더 깊이 살펴 보고 실제로 어떻게 작동하는지 알아보는 시리즈를 시작했습니다. 이 시리즈의 동기는 자바스크립트가 무엇으로 구성되어 있고 그 구성요소가 어떻게 맞물려 작동하는지 더 잘 알면 더 나은 코드와 앱을 작성할 수 있다는 생각이었습니다. 시리즈의 첫 번째 글은 엔진, 런타임, 콜스택의 개관에 초점을 맞췄습니다. 이...

https://engineering.huiseoul.com/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-%EC%9E%91%EB%8F%99%ED%95%98%EB%8A%94%EA%B0%80-v8-%EC%97%94%EC%A7%84%EC%9D%98-%EB%82%B4%EB%B6%80-%EC%B5%9C%EC%A0%81%ED%99%94%EB%90%9C-%EC%BD%94%EB%93%9C%EB%A5%BC-%EC%9E%91%EC%84%B1%EC%9D%84-%EC%9C%84%ED%95%9C-%EB%8B%A4%EC%84%AF-%EA%B0%80%EC%A7%80-%ED%8C%81-6c6f9832c1d9