Javascript 기능의 속도를 어떻게 높였습니까?

최근 프로젝트에서 효율성이 다소 떨어지는 기능을 발견했습니다. 이 함수는 두 개의 맵 루프, 세 개의 필터(각각 포함이 포함됨) 및 내장 찾기 기능이 있는 추가 맵을 수행하여 총 12번의 반복을 수행했습니다. 필터와 같은 일부 방법은 전체 배열을 순회할 필요가 없었지만 특히 대량 항목의 경우 작업 비용이 꽤 많이 들었습니다.

이 함수의 복잡성은 O(n * m)으로 프로젝트 규모가 커짐에 따라 빠르게 문제가 될 수 있습니다.

그래서 저는 이 기능을 최적화하기로 결정했습니다. 제가 취한 첫 번째 단계는 두 개의 키 배열을 세트로 바꾸는 것이었습니다. JavaScript에서 세트는 고유한 데이터를 저장하고 배열보다 훨씬 빠른 존재 여부 확인을 제공하는 구조입니다. 배열을 검사하는 데 O(n) 복잡성이 있는 반면 Set에서는 O(1)입니다. 또한 Set.has 메소드는 Array.include와 달리 Set의 데이터 개수가 증가해도 성능이 저하되지 않습니다.

이러한 변경으로 이미 어레이에서 작동하는 필터가 크게 개선되었습니다. 그러나 지도 중 하나에는 최적화할 수도 있는 Array.find()가 있었습니다. JavaScript에서 Map은 인덱스 목록인 반면 Array.find는 선형 검색을 수행하며 코드가 실행되는 프로세서의 성능에 따라 Map보다 2,100~12,000배 느릴 수 있습니다.

루프 중 하나에서 Array.find를 Map.get으로 대체하여 총 반복 횟수를 12에서 9로 줄일 수 있었습니다. 세 개의 루프를 줄이는 것은 별 의미가 없어 보일 수 있지만 알고리즘의 복잡성은 O(n m), 함수 실행 시간이 무려 96%나 단축되었습니다!

Intel Core i7-10510U에서 수행한 테스트에서 배열을 사용한 함수 실행은 5,000개 항목의 배열을 사용하여 Map and Set을 사용하여 실행하는 것보다 191.19ms~6.80ms로 28배 더 오래 걸렸습니다.

배열을 사용한 원래 알고리즘의 복잡성은 O(n * m)인 반면, 항목 수에 따라 실행 시간이 기하급수적으로 증가했다는 점을 언급할 가치가 있습니다. 소프트웨어 개발 시나리오에서는 비즈니스 성장과 코드가 실행될 시스템의 한계를 고려하는 것이 중요합니다. 예를 들어 배열이 50,000개 항목으로 증가하면 원래 알고리즘의 실행 시간은 13,585ms가 되는 반면 Set 및 Map을 사용하는 최적화된 알고리즘은 135ms만 소요됩니다. 이 경우 원래 알고리즘은 100배 느려져 최적화를 통해 실행 시간이 99% 감소합니다.

결론

정보 검색 시 Array에 비해 Set 및 Map의 속도가 우수하다는 점을 고려하면 Array.filter 또는 Array.find와 같은 반복에서 이 정보를 확인해야 할 때 Set 또는 Map을 생성하기 위한 반복 비용이 정당합니다.

그러나 순차적 순서가 부족하고 인덱스로 요소에 직접 액세스할 수 없으며 중복된 요소를 저장하지 않는다는 제한 등 몇 가지 단점으로 인해 Set 사용이 항상 실행 가능하지 않을 수 있습니다.

이러한 제한에도 불구하고 많은 상황에서 어레이를 Set 또는 Map으로 교체하면 성능과 효율성 측면에서 상당한 이점을 얻을 수 있습니다.

위 내용은 Javascript 기능의 속도를 어떻게 높였습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!