lundi 27 janvier 2020

What are the advantage or disadvantages difference import styles such as module import and * as import

I was wondering and kinda confused as to which style of import should i use, till this moment i came across these imports and i'm not sure which on is faster, or if its worth refactoring my codes to use one of these instead of another one
Type1 :, (very simple, no problem here):

//This is simple and straight forward
import Component from 'Component';

Type2 (This is one of the ones i have some doubt about):

//#definition JavascriptUtils : 
export function a {}
export function b {}
///,2000 more lines

Now this can be used in two ways:

//#usage JavascriptUtils : 
//1-
import * as JavascriptUtils from 'Utils/JavascriptUtils'
//2-
import {a, b} as JavascriptUtils from 'Utils/JavascriptUtils'

Now i'm not sure if there is a difference between 1 or 2 or if there is, should i even care ?, is there that much difference in performance or package size, i do use this utility a lot, so i'd like to know how much advantage way 1 can give me

Type3:

//#definition UIUtils : 
export const UIUtils = {
    a,
    b,
}

export function a {}
export function b {}

//#usage UIUtils
import {UIUtils} from 'Utils/UIUtils'  

Type4:

//#definition UIUtils : 
export const UIUtils = {
    a,
    b,
}

export function a {}
export function b {}

//#definition JSUtils : 
export const JSUtils = {
    c,
    d,
}

export function c {}
export function d {}

//inside utils/index.js
export * from './UIUtils';
export * from './JSUtils';

//#usage UIUtils
import {UIUtils} from 'utils'
import {JSUtils} from 'utils'

So this all the different types of import i used until now, i really like to know which one is the best, which one is faster, which one causes less build size ? or if there is not difference or the difference is small, i'd like to know that as well.
I specially like to know if i'll notice any big difference in build size if i use {a} from import vs * as utils import, my utils are more than 2000 line and are used hundred of times throughout the program Thanks!

Aucun commentaire:

Enregistrer un commentaire