Electron 4.0.0

Electron 팀은 Electron 4의 안정 버전 출시를 기쁘게 발표한다! electronjs.org에서 설치하거나 npm install electron@latest 명령어를 통해 npm으로 설치할 수 있다. 이번 릴리스는 다양한 업그레이드, 수정 사항, 그리고 새로운 기능으로 가득 차 있다. 여러분이 이를 활용해 어떤 것을 만들어낼지 기대된다. 이번 릴리스에 대한 자세한 내용은 계속 읽어보고, 탐색하면서 얻은 피드백을 공유해 주기 바란다!

새로운 기능

Electron의 기능 대부분은 Chromium, Node.js, V8이라는 핵심 컴포넌트에서 제공된다. 따라서 Electron 팀의 주요 목표는 이러한 프로젝트의 변화를 최대한 빠르게 반영해, Electron 앱을 개발하는 개발자들이 새로운 웹과 자바스크립트 기능을 활용할 수 있도록 하는 것이다. 이를 위해 Electron 4에서는 각 컴포넌트의 주요 버전이 업그레이드되었다. Electron v4.0.0은 Chromium 69.0.3497.106, Node 10.11.0, V8 6.9.427.24를 포함한다.

또한 Electron 4에는 Electron 전용 API의 변경 사항도 포함되어 있다. 아래에서 Electron 4의 주요 변경 사항을 확인할 수 있다. 전체 변경 사항은 Electron v4.0.0 릴리스 노트에서 확인할 수 있다.

remote 모듈 비활성화

보안상의 이유로 remote 모듈을 비활성화할 수 있다. BrowserWindow와 webview 태그에 대해 이 모듈을 비활성화할 수 있다:

// BrowserWindow
new BrowserWindow({
  webPreferences: {
    enableRemoteModule: false
  }
})

// webview 태그
<webview src="http://www.google.com/" enableremotemodule="false"></webview>

더 자세한 정보는 BrowserWindow와 <webview> 태그 문서를 참고한다.

remote.require() / remote.getGlobal() 요청 필터링

이 기능은 렌더러 프로세스나 webview에서 remote 모듈을 완전히 비활성화하지 않고도, remote.require를 통해 어떤 모듈을 요청할 수 있는지 추가적으로 제어하고 싶을 때 유용하다.

렌더러 프로세스에서 remote.require를 통해 모듈을 요청하면, app 모듈에서 remote-require 이벤트가 발생한다. 이 이벤트의 첫 번째 인자에서 event.preventDefault()를 호출하면 해당 모듈이 로드되는 것을 막을 수 있다. 요청이 발생한 WebContents 인스턴스는 두 번째 인자로 전달되며, 요청된 모듈의 이름은 세 번째 인자로 전달된다. 동일한 이벤트가 WebContents 인스턴스에서도 발생하지만, 이 경우에는 이벤트와 모듈 이름만 인자로 전달된다. 두 경우 모두 event.returnValue를 설정하여 커스텀 값을 반환할 수 있다.

// 모든 WebContents에서 `remote.require` 제어:
app.on('remote-require', function (event, webContents, requestedModuleName) {
  // ...
});

// 특정 WebContents 인스턴스에서 `remote.require` 제어:
browserWin.webContents.on(
  'remote-require',
  function (event, requestedModuleName) {
    // ...
  },
);

비슷한 방식으로, remote.getGlobal(name)이 호출되면 remote-get-global 이벤트가 발생한다. 이 이벤트는 remote-require 이벤트와 동일하게 작동한다: preventDefault()를 호출하여 글로벌 값이 반환되는 것을 막을 수 있으며, event.returnValue를 설정하여 커스텀 값을 반환할 수 있다.

// 모든 WebContents에서 `remote.getGlobal` 제어:
app.on(
  'remote-get-global',
  function (event, webContents, requrestedGlobalName) {
    // ...
  },
);

// 특정 WebContents 인스턴스에서 `remote.getGlobal` 제어:
browserWin.webContents.on(
  'remote-get-global',
  function (event, requestedGlobalName) {
    // ...
  },
);

더 많은 정보는 다음 문서를 참고한다:

• remote.require
• remote.getGlobal
• app
• WebContents

About 패널에 JavaScript로 접근하기

macOS에서는 app.showAboutPanel()을 호출해 프로그램적으로 About 패널을 표시할 수 있다. 이 기능은 {role: 'about'}로 생성한 메뉴 항목을 클릭하는 것과 동일하게 동작한다. 더 자세한 정보는 showAboutPanel 문서를 참고한다.

WebContents 백그라운드 스로틀링 제어

WebContents 인스턴스는 페이지가 백그라운드 상태일 때 타이머와 애니메이션의 스로틀링을 활성화하거나 비활성화할 수 있는 setBackgroundThrottling(allowed) 메서드를 제공한다.

let win = new BrowserWindow(...)
win.webContents.setBackgroundThrottling(enableBackgroundThrottling)

더 자세한 내용은 setBackgroundThrottling 문서를 참고한다.

주요 변경 사항

macOS 10.9 지원 중단

Chromium이 더 이상 macOS 10.9(OS X Mavericks)를 지원하지 않기 때문에, Electron 4.0 이상 버전도 이를 지원하지 않는다.

단일 인스턴스 잠금

이전에는 앱을 단일 인스턴스 애플리케이션으로 만들기 위해(앱의 한 인스턴스만 실행되도록 보장) app.makeSingleInstance() 메서드를 사용할 수 있었다. Electron 4.0부터는 app.requestSingleInstanceLock() 메서드를 대신 사용해야 한다. 이 메서드의 반환 값은 현재 애플리케이션 인스턴스가 잠금을 성공적으로 획득했는지 여부를 나타낸다. 잠금 획득에 실패했다면, 이미 다른 인스턴스가 잠금을 가지고 실행 중이라고 간주하고 즉시 종료하면 된다.

requestSingleInstanceLock() 사용 예제와 다양한 플랫폼에서의 세부 동작에 대한 정보는 app.requestSingleInstanceLock() 및 관련 메서드 문서와 second-instance 이벤트 문서를 참고한다.

win_delay_load_hook

윈도우용 네이티브 모듈을 빌드할 때, 모듈의 binding.gyp 파일에 있는 win_delay_load_hook 변수는 반드시 true로 설정해야 한다(기본값이 true임). 이 훅이 없으면 윈도우에서 네이티브 모듈을 로드할 수 없으며, Cannot find module과 같은 오류 메시지가 나타난다. 자세한 내용은 네이티브 모듈 가이드를 참고한다.

지원 중단 예정 기능

다음과 같은 주요 변경 사항은 Electron 5.0에서 적용될 예정이며, 따라서 Electron 4.0에서는 지원 중단(deprecated)으로 표시된다.

nativeWindowOpen으로 열린 윈도우에서 Node.js 통합 비활성화

Electron 5.0부터 nativeWindowOpen 옵션을 사용해 열린 자식 윈도우에서는 항상 Node.js 통합이 비활성화된다.

webPreferences 기본값

webPreferences 옵션을 설정하여 새로운 BrowserWindow를 생성할 때, 다음 webPreferences 옵션의 기본값은 아래에 나열된 새로운 기본값으로 대체되었다.

속성	더 이상 사용되지 않는 기본값	새로운 기본값
contextIsolation	false	true
nodeIntegration	true	false
webviewTag	nodeIntegration 값이 설정된 경우 그 값을 사용, 그렇지 않으면 true	false

참고: 현재 contextIsolation이 활성화된 상태에서 webview 태그가 작동하지 않는 알려진 버그 (#9736)가 있다. 최신 정보는 GitHub 이슈를 확인하자.

컨텍스트 격리, Node 통합, webview 태그에 대한 더 자세한 내용은 Electron 보안 문서를 참고하자.

Electron 4.0에서는 여전히 현재의 기본값을 사용하지만, 명시적인 값을 전달하지 않으면 더 이상 사용되지 않는다는 경고가 표시된다. Electron 5.0을 대비하려면 이러한 옵션에 명시적인 값을 사용해야 한다. 각 옵션에 대한 자세한 내용은 BrowserWindow 문서를 참고하자.

webContents.findInPage(text[, options])

medialCapitalAsWordStart와 wordStart 옵션은 상위 스트림에서 제거되었기 때문에 더 이상 사용되지 않는다.

앱 피드백 프로그램

Electron 3.0 개발 과정에서 도입한 앱 피드백 프로그램이 성공적이었기 때문에, 4.0 개발 과정에서도 이 프로그램을 계속 진행했다. Atlassian, Discord, MS Teams, OpenFin, Slack, Symphony, WhatsApp 및 다른 프로그램 멤버들에게 4.0 베타 기간 동안의 참여에 대해 깊은 감사를 표한다. 앱 피드백 프로그램에 대해 더 알아보고 향후 베타 테스트에 참여하려면 프로그램에 관한 블로그 포스트를 확인해보기 바란다.

다음 단계

단기적으로, 팀은 Chromium, Node, V8 등 Electron을 구성하는 주요 컴포넌트의 개발 속도를 따라잡는 데 계속 집중할 계획이다. 출시 일정에 대한 약속은 신중하게 하겠지만, 대략 분기별로 이러한 컴포넌트의 새 버전과 함께 Electron의 새로운 주요 버전을 출시할 예정이다. Electron의 버전 관리에 대한 더 자세한 정보는 버전 관리 문서를 참고한다.

다가오는 Electron 버전에서 예정된 주요 변경 사항에 대한 정보는 예정된 주요 변경 사항 문서를 확인한다.