簡單說差別：import 是編譯中執行，CommonJS 的 require 是同步加載
import 無論在 node 或是瀏覽器都不能直接使用，透過 Babel 轉譯後還是使用 CommonJS 加載，所以兩者其實透過轉譯後是一樣的，只是遵循的規範及出現的時間點不同而已。
在效能上基本上沒區別，因為轉譯過後還是一樣的東西。
require / exports 出生在野生規範，也就是 JavaScript 社群開發者自己草擬的規則，得到了大家的廣泛應用。
現在大家比較常接觸的 import / export 則是所謂的名門正派，跟隨著新的 ECMAScript 版本，也就是大家常聽到的 ES5 / ES6 。
在 JavaScript 引擎還不支援 ES6 的情況下，只能用 webpacker + babel 轉譯，這時候 require / exports 依舊是必須使用的，因為 babel 最後將轉成瀏覽器能懂得 CommonJS，所以也就是如果你寫了 import 最後還是會被轉成 require 的。
不過以 require / exports 來說，只有簡單的寫法
const component = require('component')
exports.component = component
module.exports = component
而 import/export 的寫法就很多樣了
import fs from 'fs'
import { default as fs } from 'fs'
import * as fs from 'fs'
import { readFile} from 'fs'
import { readFile as read } from 'fs'
import fs, { readFile } from 'fs'
export default fs
export const fs
export function readFile
export { readFile, read }
export * from 'fs'
import 屬於靜態編譯，所以沒辦法動態加載，但 require 就可以了
const url = "a" + "b"
import url // => 噴錯
require(url) //=> OK
雖然在 node 9 以上版本就可以使用 ES6 了，但是還是需要設定一些東西，避免麻煩，大家多半還是用 webpacker + babel 解決。
小結
- 基本上現在能用 ES6 寫 import 就用吧。
- 有用 webpacker / babel 的話，不用在意 import 與 require 的效能，因為最後都會轉為 CommonJS
- 需要動態加載時才使用 require