@modern-kit/utils@2.0.0

Release

@modern-kit/utils v2.0.0부터 SubPath를 지원합니다.

SubPath

• 전체 모듈을 불러오는 것이 아닌 필요한 모듈만 직접 가져오기 때문에 불 필요한 코드를 불러오는 것을 방지할 수 있으며, 번들러가 모듈을 읽고, 식별하는 과정을 최적화 할 수 있습니다.
• 번들러가 개별 모듈을 더 잘 식별할 수 있기 때문에, Tree-shaking이 더욱 효과적으로 동작하도록 개선 할 수 있습니다. 이는 결과적으로 최종 번들 크기를 줄이는데 도움이 됩니다.

// 일반 케이스
import { flatten } from '@modern-kit/utils';

const arr = [1, [2, [3, 4], 5]];
const result = flatten(arr); // [1, 2, 3, 4, 5]

// SubPath 사용 예시
// tsconfig moduleResolution 옵션이 `bundler`일 경우
import { flatten } from '@modern-kit/utils/array/flatten';
// tsconfig moduleResolution 옵션이 `node`일 경우
import { flatten } from '@modern-kit/utils/dist/array/flatten';

const arr = [1, [2, [3, 4], 5]];
const result = flatten(arr); // [1, 2, 3, 4, 5]

Next.js 개발 환경에서 SubPath 사용 차이

SubPath 사용하지 않은 경우

import { flatten } from "@modern-kit/utils";

export default function Home() {
  console.log(flatten([1, [2], [3], [4], [5]]));

  return (
    <div>{}</div>
  );
}

첫 번째 이미지는 SubPath를 사용하지 않은 경우입니다. 전체 모듈에서 flatten을 가져온 경우입니다.
위 이미지와 같이 @modern-kit/utils의 모든 모듈을 불러오는 것을 확인 할 수 있습니다.

SubPath 사용한 경우

// tsconfig moduleResolution 옵션이 `node`
import { flatten } from "@modern-kit/utils/dist/array/flatten";

export default function Home() {
  console.log(flatten([1, [2], [3], [4], [5]]));

  return (
    <div>{}</div>
  );
}

두 번째 이미지는 SubPath를 사용한 경우입니다. 개별 경로를 통해 flatten을 가져온 경우입니다.
첫 번째 케이스와 다르게 사용하는 @modern-kit/utils의 flatten만 불러오는 것을 확인 할 수 있습니다.

이러한 차이는 개발 서버 성능에 영향을 미칠 수 있습니다.

@modern-kit/react@2.0.0

Release

@modern-kit/react v2.0.0부터 SubPath를 지원합니다.

SubPath

• 전체 모듈을 불러오는 것이 아닌 필요한 모듈만 직접 가져오기 때문에 불 필요한 코드를 불러오는 것을 방지할 수 있으며, 번들러가 모듈을 읽고, 식별하는 과정을 최적화 할 수 있습니다.
• 번들러가 개별 모듈을 더 잘 식별할 수 있기 때문에, Tree-shaking이 더욱 효과적으로 동작하도록 개선 할 수 있습니다. 이는 결과적으로 최종 번들 크기를 줄이는데 도움이 됩니다.

// 일반 케이스
import { useInterval } from '@modern-kit/react';

const App = () => {
  useInterval(() => {
    console.log('interval');
  }, 300);

  return <div>Modern Kit</div>;
}

// tsconfig moduleResolution 옵션이 `node`일 경우
import { useInterval } from '@modern-kit/react/dist/hooks/useInterval';
// tsconfig moduleResolution 옵션이 `bundler`일 경우
import { useInterval } from '@modern-kit/react/hooks/useInterval';

const App = () => {
  useInterval(() => {
    console.log('interval');
  }, 300);

  return <div>Modern Kit</div>;
}

Next.js 개발 환경에서 SubPath 사용 차이

SubPath 사용하지 않은 경우

import { flatten } from "@modern-kit/utils";

export default function Home() {
  console.log(flatten([1, [2], [3], [4], [5]]));

  return (
    <div>{}</div>
  );
}

첫 번째 이미지는 SubPath를 사용하지 않은 경우입니다. 전체 모듈에서 flatten을 가져온 경우입니다.
위 이미지와 같이 @modern-kit/utils의 모든 모듈을 불러오는 것을 확인 할 수 있습니다.

SubPath 사용한 경우

// tsconfig moduleResolution 옵션이 `node`
import { flatten } from "@modern-kit/utils/dist/array/flatten";

export default function Home() {
  console.log(flatten([1, [2], [3], [4], [5]]));

  return (
    <div>{}</div>
  );
}

두 번째 이미지는 SubPath를 사용한 경우입니다. 개별 경로를 통해 flatten을 가져온 경우입니다.
첫 번째 케이스와 다르게 사용하는 @modern-kit/utils의 flatten만 불러오는 것을 확인 할 수 있습니다.

이러한 차이는 개발 서버 성능에 영향을 미칠 수 있습니다.

@modern-kit/react@1.27.7

Patch Changes

• #688 f91b55c Thanks @ssi02014! - fix(react): dist exports 추가하여 SubPath 동작 개선 - @ssi02014

@modern-kit/react@1.27.6

Patch Changes

• #686 6405c00 Thanks @ssi02014! - fix(react): rollup setting 수정 - @ssi02014

@modern-kit/utils@1.26.2

Patch Changes

• #674 8b3f288 Thanks @ssi02014! - fix(utils): formatValueWithSymbol 자연스러운 역할 이해를 위해 네이밍 변경 - @ssi02014

@modern-kit/react@1.27.2

Patch Changes

• #677 41a4223 Thanks @ssi02014! - fix(react): SwitchCase 하위 타입스크립트/리액트 버전 타입 호환성을 위해 반환 타입 수정 - @ssi02014

@modern-kit/utils@1.26.1

Patch Changes

• #671 37ef40a Thanks @ssi02014! - fix(utils): formatNumberWithCurrency locale 값 타입을 locale 포맷에 맞게 변경 - @ssi02014

@modern-kit/utils@1.26.0

Minor Changes

• #666 57ff5c1 Thanks @ssi02014! - fix(utils): formatNumberWithUnits, formatNumberWithCurrency 로직 개선 및 인터페이스 변경 - @ssi02014

@modern-kit/types@1.7.0

Minor Changes

• #667 2ecdfd1 Thanks @ssi02014! - feat(types): DeepPartial 유틸 타입 추가 - @ssi02014

@modern-kit/utils@1.25.1

Patch Changes

• #664 3ac397e Thanks @ssi02014! - fix(utils): formatNumberWithCommas 로직 수정으로 인터페이스 개선 - @ssi02014