44 Beiträge mit "Release" markiert

In den letzten zwei Jahren hat Electron Entwicklern dabei geholfen, plattformübergreifende Desktop-Apps mit HTML, CSS und JavaScript zu erstellen. Now we're excited to share a major milestone for our framework and for the community that created it. Die Version von Electron 1.0 ist ab sofort bei electronjs.org verfügbar.

Electron 1.0 represents a major milestone in API stability and maturity. This release allows you to build apps that act and feel truly native on Windows, Mac, and Linux. Building Electron apps is easier than ever with new docs, new tools, and a new app to walk you through the Electron APIs.

Wenn Sie bereit sind, Ihre allererste Electron-App zu erstellen, hier ist eine Schnellstart-Anleitung um Ihnen beim Start zu helfen.

We are excited to see what you build next with Electron.

Electron's Path​

Wir haben Electron freigegeben, als wir vor etwas mehr als zwei Jahren Atom starteten. Electron, then known as Atom Shell, was the framework we'd built Atom on top of. In those days, Atom was the driving force behind the features and functionalities that Electron provided as we pushed to get the initial Atom release out.

Das Fahren von Electron ist eine wachsende Gemeinschaft von Entwicklern und Firmen, die alles aus E-Mail, Chatbauen, und Git Apps bis SQL Analytics Tools, Torrent-Clients, und Roboter.

In these last two years we've seen both companies and open source projects choose Electron as the foundation for their apps. Just in the past year, Electron has been downloaded over 1.2 million times. Machen Sie eine Tour durch einige der erstaunlichen Electron-Apps und fügen Sie Ihre eigene hinzu, wenn sie noch nicht vorhanden ist.

Electron API Demos​

Along with the 1.0 release, we're releasing a new app to help you explore the Electron APIs and learn more about how to make your Electron app feel native. Zusammen mit dem 1. freisetzen, wir veröffentlichen eine neue App, um dir zu helfen, die Electron-APIs zu erkunden und mehr darüber zu erfahren, wie du deine Electron-App einheimisch machen kannst.

Devtron​

We've also added a new extension to help you debug your Electron apps. Devtron ist eine Open-Source-Erweiterung für die Chrome Developer Tools , die Ihnen helfen sollen, zu prüfen, debuggen und Ihre Electron-App beheben.

Features​

• Require graph that helps you visualize your app's internal and external library dependencies in both the main and renderer processes
• IPC monitor that tracks and displays the messages sent and received between the processes in your app
• Event inspector that shows you the events and listeners that are registered in your app on the core Electron APIs such as the window, app, and processes
• App Linter that checks your apps for common mistakes and missing functionality

Spectron​

Schließlich veröffentlichen wir eine neue Version von Spectron, dem Integration Test-Framework für Electron-Apps.

Spectron 3.0 has comprehensive support for the entire Electron API allowing you to more quickly write tests that verify your application's behavior in various scenarios and environments. Spectron basiert auf ChromeDriver und WebDriverIO so dass es auch volle APIs für die Seitennavigation hat, Benutzer Eingabe und JavaScript-Ausführung.

Community​

Electron 1.0 is the result of a community effort by hundreds of developers. Outside of the core framework, there have been hundreds of libraries and tools released to make building, packaging, and deploying Electron apps easier.

Es gibt jetzt eine neue Community Seite, die viele der fantastischen zu entwickelnden Elektrowerkzeuge, Apps, Bibliotheken und Frameworks auflistet. Sie können sich auch die Electron und Electron Userland Organisationen ansehen, um einige dieser fantastischen Projekte zu sehen.

New to Electron? Watch the Electron 1.0 intro video:

Electron 0.37 wurde vor kurzem veröffentlicht und beinhaltet ein großes Upgrade von Chrome 47 zu Chrome 49 und auch mehrere neue Kern-APIs. Dieses neuste Release bringt alle neuen Features von Chrome 48 und Chrome 49 mit. Dies beinhaltet CSS custom Properties, erweiterte ES6-Unterstützung, KeyboardEvent-Verbesserungen, Promise-Verbesserungen und viele andere neue Features, welche jetzt in deiner Electron-App zur Verfügung stehen.

Was ist neu​

CSS Custom Properties​

Wenn Sie preprocessed Sprachen wie Sass und Less verwendet haben, sind Sie wahrscheinlich mit _Variablen_vertraut, mit denen Sie wiederverwendbare Werte für Dinge wie Farbschemata und Layouts definieren können. Variablen helfen dabei, Ihre Stylesheets DRY und wartbarer zu halten.

CSS custom properties ähneln preprocessed Variablen, da sie wiederverwendbar sind, aber sie haben auch eine einzigartige Qualität, die sie noch mächtiger und flexibler macht: sie können mit JavaScript manipuliert werden. Diese subtile, aber leistungsstarke Funktion ermöglicht dynamische Änderungen an visuellen Schnittstellen und profitiert gleichzeitig von der CSS-Hardwarebeschleunigung und der reduzierten Code-Duplizierung zwischen Ihrem Frontend-Code und den Stylesheets.

Weitere Informationen zu CSS custom properties finden Sie im MDN Artikel und in der Google Chrome Demo.

CSS-Variablen in Aktion​

Gehen wir durch ein einfaches variables Beispiel, das live in deiner App angepasst werden kann.

:root {
  --awesome-color: #a5ecfa;
}

body {
  background-color: var(--awesome-color);
}

Der Variablenwert kann direkt in JavaScript abgerufen und geändert werden:

// Holt den Variablenwert ' #A5ECFA'
let color = window
  .getComputedStyle(document.body)
  .getPropertyValue('--awesome-color');

// Variablenwert auf 'orange' setzen
document.body.style.setProperty('--awesome-color', 'orange');

Die Variablenwerte können auch aus dem Styles Abschnitt der Entwicklungstools bearbeitet werden, um schnelle Rückmeldungen und Optimierungen zu erhalten:

KeyboardEvent.code Eigenschaft​

Chrome 48 hat die neue code Eigenschaft für KeyboardEvent Ereignisse hinzugefügt, die die physikalische Taste, unabhängig vom Betriebssystem-Tastaturlayout, die gedrückt wurde, angibt.

Dies sollte die Implementierung benutzerdefinierter Tastaturkürzel in Ihrer Electron-App über Maschinen und Konfigurationen hinweg genauer und konsistenter machen.

window.addEventListener('keydown', function (event) {
  console.log(`${event.code} wurde gedrückt.`);
});

Schauen Sie sich dieses Beispiel an, um es in Aktion zu sehen.

Promise Rejection Events​

Chrome 49 hat zwei neue window Events hinzugefügt, die es Ihnen erlauben, benachrichtigt zu werden, wenn eine abgelehnte Promise nicht verarbeitet wird.

window.addEventListener('unhandledrejection', function (event) {
  console.log('A rejected promise was unhandled', event.promise, event.reason);
});

window.addEventListener('rejectionhandled', function (event) {
  console.log('A rejected promise was handled', event.promise, event.reason);
});

Schauen Sie sich dieses Beispiel an, um es in Aktion zu sehen.

ES2015 Updates in V8​

Die Version von V8 jetzt in Electron beinhaltet 91% von ES2015. Hier sind ein paar interessante Ergänzungen, die Sie out of the Box verwenden können – ohne Flags oder pre-compilers:

Standardparameter​

function multiply(x, y = 1) {
  return x * y;
}

multiply(5); // 5

Destructuring assignment​

Mit Chrome 49 wurde die destructuring assignment hinzugefügt, um die Zuweisung von Variablen und Funktionsparametern zu vereinfachen.

Dies macht Electron sauberer und kompakter, um es jetzt zuzuweisen:

Browserprozess benötigt​

const { app, BrowserWindow, Menu } = require('electron');

Renderer-Prozess benötigt​

const { dialog, Tray } = require('electron').remote;

Andere Beispiele​

// Destructuring an array and skipping the second element
const [first, , last] = findAll();

// Destructuring function parameters
function whois({ displayName: displayName, fullName: { firstName: name } }) {
  console.log(`${displayName} is ${name}`);
}

let user = {
  displayName: 'jdoe',
  fullName: {
    firstName: 'John',
    lastName: 'Doe',
  },
};
whois(user); // "jdoe is John"

// Destructuring an object
let { name, avatar } = getUser();

Neue Electron-APIs​

Einige der neuen Electron-APIs sind unten, Sie können jede neue API in den Versionshinweisen für Electron Releases sehen.

show und hide Events auf BrowserWindow​

Diese Ereignisse werden emittiert, wenn das Fenster entweder angezeigt oder ausgeblendet wird.

const { BrowserWindow } = require('electron');

let window = new BrowserWindow({ width: 500, height: 500 });
window.on('show', function () {
  console.log('Fenster wurde angezeigt');
});
window.on('hide', function () {
  console.log('Fenster wurde versteckt');
});

platform-theme-changed auf app für OS X​

Dieses Event wird emittiert, wenn der Dunkle Modus des Systems aktiviert ist.

const { app } = require('electron');

app.on('platform-theme-changed', function () {
  console.log(`Plattform Thema geändert. Im dunklen Modus? ${app.isDarkMode()}`);
});

app.isDarkMode() für OS X​

Diese Methode gibt true zurück, wenn sich das System im Dunklen Modus befindet, andernfalls false.

scroll-touch-begin und scroll-touch-end Ereignisse im BrowserWindow für OS X​

Diese Ereignisse werden emittiert, wenn die scroll wheel event Phase begonnen hat oder beendet ist.

const { BrowserWindow } = require('electron');

let window = new BrowserWindow({ width: 500, height: 500 });
window.on('scroll-touch-begin', function () {
  console.log('Scroll touch gestartet');
});
window.on('scroll-touch-end', function () {
  console.log('Scroll touch geendet');
});

Since the beginning of Electron, starting way back when it used to be called Atom-Shell, we have been experimenting with providing a nice cross-platform JavaScript API for Chromium's content module and native GUI components. The APIs started very organically, and over time we have made several changes to improve the initial designs.

Now with Electron gearing up for a 1.0 release, we'd like to take the opportunity for change by addressing the last niggling API details. The changes described below are included in 0.35.x, with the old APIs reporting deprecation warnings so you can get up to date for the future 1.0 release. An Electron 1.0 won't be out for a few months so you have some time before these changes become breaking.

Deprecation warnings​

By default, warnings will show if you are using deprecated APIs. To turn them off you can set process.noDeprecation to true. To track the sources of deprecated API usages, you can set process.throwDeprecation to true to throw exceptions instead of printing warnings, or set process.traceDeprecation to true to print the traces of the deprecations.

New way of using built-in modules​

Built-in modules are now grouped into one module, instead of being separated into independent modules, so you can use them without conflicts with other modules:

var app = require('electron').app;
var BrowserWindow = require('electron').BrowserWindow;

The old way of require('app') is still supported for backward compatibility, but you can also turn if off:

require('electron').hideInternalModules();
require('app'); // throws error.

An easier way to use the remote module​

Because of the way using built-in modules has changed, we have made it easier to use main-process-side modules in renderer process. You can now just access remote's attributes to use them:

// New way.
var app = require('electron').remote.app;
var BrowserWindow = require('electron').remote.BrowserWindow;

Instead of using a long require chain:

// Old way.
var app = require('electron').remote.require('app');
var BrowserWindow = require('electron').remote.require('BrowserWindow');

Splitting the ipc module​

The ipc module existed on both the main process and renderer process and the API was different on each side, which is quite confusing for new users. We have renamed the module to ipcMain in the main process, and ipcRenderer in the renderer process to avoid confusion:

// Im Hauptprozess.
var ipcMain = require('electron').ipcMain;

// In renderer process.
var ipcRenderer = require('electron').ipcRenderer;

And for the ipcRenderer module, an extra event object has been added when receiving messages, to match how messages are handled in ipcMain modules:

ipcRenderer.on('message', function (event) {
  console.log(event);
});

Standardizing BrowserWindow options​

The BrowserWindow options had different styles based on the options of other APIs, and were a bit hard to use in JavaScript because of the - in the names. They are now standardized to the traditional JavaScript names:

new BrowserWindow({ minWidth: 800, minHeight: 600 });

Following DOM's conventions for API names​

The API names in Electron used to prefer camelCase for all API names, like Url to URL, but the DOM has its own conventions, and they prefer URL to Url, while using Id instead of ID. We have done the following API renames to match the DOM's styles:

• Url is renamed to URL
• Csp is renamed to CSP

You will notice lots of deprecations when using Electron v0.35.0 for your app because of these changes. An easy way to fix them is to replace all instances of Url with URL.

Changes to Tray's event names​

The style of Tray event names was a bit different from other modules so a rename has been done to make it match the others.

• clicked is renamed to click
• double-clicked is renamed to double-click
• right-clicked is renamed to right-click

Kürzlich gab es einige interessante Neuigkeiten und Diskussionen über Electron. Hier ist eine Zusammenfassung.

Source​

Electron v0.32.0 ist nun mit Chrome 45 aktualisiert worden. Weitere Aktualisierungen beinhalten...

Bessere Dokumentation​

Die Dokumentation wurde von uns restrukturiert und standardisiert, damit sie besser aussieht und leichter zu lesen ist. Es sind auch Übersetzungen der Dokumentation vorhanden, die von einer Gemeinschaft freiwilliger Übersetzer angefertigt worden sind, beispielsweise Japanisch und Koreanisch.

Verwandte Pull-Anfrage: electron/electron#2028, electron/electron#2533, electron/electron#2557, electron/electron#2709, electron/electron#2725, electron/electron#2698, electron/electron#2649.

Node.js 4.1.0​

Electron wird ab v0.33.0 mit Node.js 4.1.0 geliefert.

Verwandte Pull-Anfrage: electron/electron#2817.

node-pre-gyp​

Modules relying on node-pre-gyp can now be compiled against Electron when building from source.

Related pull request: mapbox/node-pre-gyp#175.

ARM Support​

Electron now provides builds for Linux on ARMv7. It runs on popular platforms like Chromebook and Raspberry Pi 2.

Related issues: atom/libchromiumcontent#138, electron/electron#2094, electron/electron#366.

Yosemite-style Frameless Window​

A patch by @jaanus has been merged that, like the other built-in OS X apps, allows creating frameless windows with system traffic lights integrated on OS X Yosemite and later.

Related pull request: electron/electron#2776.

Google Summer of Code Printing Support​

After the Google Summer of Code we have merged patches by @hokein to improve printing support, and add the ability to print the page into PDF files.

Related issues: electron/electron#2677, electron/electron#1935, electron/electron#1532, electron/electron#805, electron/electron#1669, electron/electron#1835.

Atom​

Atom has now upgraded to Electron v0.30.6 running Chrome 44. An upgrade to v0.33.0 is in progress on atom/atom#8779.

Vorträge​

GitHubber Amy Palamountain gave a great introduction to Electron in a talk at Nordic.js. She also created the electron-accelerator library.

Building native applications with Electron by Amy Palomountain​

Ben Ogle, also on the Atom team, gave an Electron talk at YAPC Asia:

Building Desktop Apps with Web Technologies by Ben Ogle​

Atom team member Kevin Sawicki and others gave talks on Electron at the Bay Are Electron User Group meetup recently. The videos have been posted, here are a couple:

The History of Electron by Kevin Sawicki​

Making a web app feel native by Ben Gotow​