{"id":21015,"date":"2016-03-30T09:48:39","date_gmt":"2016-03-30T08:48:39","guid":{"rendered":"https:\/\/www.inovex.de\/\/?p=1532"},"modified":"2026-03-17T08:00:07","modified_gmt":"2026-03-17T07:00:07","slug":"polymer-tooling","status":"publish","type":"post","link":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/","title":{"rendered":"Polymer Tooling"},"content":{"rendered":"<p>Nachdem mit Polymer 1.0 eine stabile Basis f\u00fcr produktive Anwendung der Bibliothek geschaffen wurde, ist es die Top-Priorit\u00e4t des Entwickler:innen-Teams, das Tooling rund um Polymer zu verbessern, damit Polymer nicht nur theoretisch, sondern auch praktisch zur Entwicklung von modernen Webapps eingesetzt wird. Dabei stehen generell nicht nur Entwicklungsgeschwindigkeit und Performance sondern auch die Wiederverwendbarkeit und korrekte Dokumentation von selbst erstellen Komponenten im Fokus.<\/p>\n<p>In diesem Artikel wird gezeigt, welche Tools, die den Gebrauch von Polymer im Entwickler:innen-Alltag vereinfachen, heute schon bereitstehen oder sich in der aktiven Entwicklung befinden. Dabei wird ein prototypischer Workflow mit Build-Chain anhand der verf\u00fcgbaren Werkzeuge skizziert, um einen Ausblick auf die zuk\u00fcnftigen M\u00f6glichkeiten zu geben.<\/p>\n<p><!--more--><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_83 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\"><p class=\"ez-toc-title\" style=\"cursor:inherit\"><\/p>\n<\/div><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Getting-started\" >Getting started<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Testen-mit-WCT\" >Testen mit WCT<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Leaky-State-verhindern\" >Leaky State verhindern<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Der-Deployment-Build\" >Der Deployment-Build<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Documentation-driven-Development\" >Documentation-driven Development<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#UI-Design-in-Polymer\" >UI-Design in Polymer<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Component-Hosting-leicht-gemacht\" >Component-Hosting leicht gemacht<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Links-Literatur\" >Links &amp; Literatur<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Were-hiring\" >We&#8217;re hiring!<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#Weiterlesen\" >Weiterlesen<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Getting-started\"><\/span>Getting started<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Damit die Entwicklung von eigenen Projekten mithilfe von Polymer auch f\u00fcr Anf\u00e4nger m\u00f6glichst einfach ist, hat das Polymer-Team das \u201ePolymer Starterkit\u201c ins Leben gerufen. Dabei handelt es sich um eine Projektvorlage\/ein\u00a0Template, das\u00a0eine funktionierende Entwicklungsumgebung bereitstellt, mit der direkt losgelegt werden kann. Zuvor muss allerdings die Node.js-Laufzeitumgebung und das als Build-System verwendete Gulp installiert werden. Als Dependency-Manager wird Bower eingesetzt. Die Vorlage beinhaltet nicht nur die Entwicklungsumgebung sondern auch ein kleines Beispielprojekt, das die verschiedenen Features aufzeigt und ein guter Startpunkt f\u00fcr ein eigenes Projekt ist. Beispielsweise ist ein Router-Element und ein rudiment\u00e4res Layout auf Basis von Paper-Elementen bereits inkludiert.<\/p>\n<p>Zum Erzeugen eines neuen Projekts auf Basis des\u00a0Polymer Starterkit kann entweder die Zip-Datei des neuesten Releases heruntergeladen und entpackt\u00a0oder das Scaffolding-Tool Yeoman genutzt werden. F\u00fcr Yeoman gibt es den Polymer-Generator, welcher die Installation des Starterkits und seiner Abh\u00e4ngigkeiten \u00fcbernimmt.<\/p>\n<p>Das Einrichten mithilfe von Yeoman funktioniert folgenderma\u00dfen:<\/p>\n<pre class=\"lang:sh decode:true\">npm install -g yo@1.4.8 &amp;&amp; npm install -g generator-polymer@1.2.1\r\n\r\nyo polymer:app<\/pre>\n<p>Ohne Yeoman m\u00fcssen die Abh\u00e4ngigkeiten von Hand installiert werden:<\/p>\n<pre class=\"lang:sh decode:true\">#laden und entpacken von polymer-starter-kit.zip\r\n\r\nnpm install #installation der entwicklungsumgebung\r\n\r\nbower install #download der abh\u00e4ngigkeiten<\/pre>\n<p>Nach dem Einrichten des Starterkits kann mit dem Befehl \u201egulp serve\u201c ein Entwicklungs-Webserver gestartet werden, der die Web-App zu Testzwecken anzeigt. Um die Feedback-Schleife w\u00e4hrend des Entwickelns m\u00f6glichst kurz zu halten, horcht gulp auf Datei-\u00c4nderungen und l\u00e4dt bei Bedarf die Web-App im Browser neu.<\/p>\n<p>Der mit gulp realisierte Build-Prozess f\u00fchrt folgende Schritte aus:<\/p>\n<ul>\n<li style=\"font-weight: 400;\">Optimieren von Bildern und Fonts<\/li>\n<li style=\"font-weight: 400;\">Minifizieren von Stylesheets, Skripten und HTML-Code<\/li>\n<li style=\"font-weight: 400;\">Konkatenation aller verwendeten Komponenten in eine einzelne HTML-Datei<\/li>\n<\/ul>\n<p>Zus\u00e4tzlich wird Javascript-Code mithilfe von JSHint auf m\u00f6gliche Fehler untersucht. Im Kapitel \u201eDeployment-Build\u201c werden die Besonderheiten des Prozesses genauer erkl\u00e4rt.<\/p>\n<p>Mit \u201egulp test\u201c k\u00f6nnen die Unit-Tests der selbst erstellten Komponenten mit dem Web Component Tester ausgef\u00fchrt werden.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Testen-mit-WCT\"><\/span>Testen mit WCT<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Wie jeder Code sollten mit Polymer erstellte Web Components vor dem Release gr\u00fcndlich getestet werden. Die \u201eUnit\u201c, die sich im Falle Polymer anbietet, ist die einzelne Komponente. Die Tests f\u00fcr eine Komponente werden dabei in einer HTML-Datei gekapselt:<\/p>\n<pre class=\"lang:xhtml decode:true\">&lt;!doctype html&gt;\r\n\r\n&lt;html&gt;\r\n\r\n    &lt;head&gt;\r\n\r\n        &lt;script src=\"..\/..\/webcomponentsjs\/webcomponents.js\"&gt;&lt;\/script&gt;\r\n\r\n        &lt;script src=\"..\/..\/web-component-tester\/browser.js\"&gt;&lt;\/script&gt;\r\n\r\n        &lt;link rel=\"import\" href=\"..\/ph-listview.html\"&gt;\r\n\r\n    &lt;\/head&gt;\r\n\r\n    &lt;body&gt;\r\n\r\n        &lt;ph-listview id=\u201celementToTest\u201c&gt;&lt;\/ph-listview&gt;\r\n\r\n        &lt;!-- ... --&gt;\r\n\r\n    &lt;\/body&gt;\r\n\r\n&lt;\/html&gt;<\/pre>\n<p>In dieser Vorlage werden der Webcomponent-Polyfill, der Testrunner und die zu testende Komponente geladen. Im <i>body<\/i> wird das zu testende Element angelegt. Die Tests selbst stehen dann in einem <i>script<\/i>-Tag, das auf das Element folgt:<\/p>\n<pre class=\"lang:xhtml decode:true \">&lt;script&gt;\r\n\r\n    suite('ph-listview', function () {\r\n\r\n        test('viewType should be `default`', function () {\r\n\r\n            var element = document.getElementById(\u2019elementToTest\u2019);\r\n\r\n            assert.equal(element.viewType, 'default');\r\n\r\n         });\r\n\r\n    });\r\n\r\n&lt;\/script&gt;<\/pre>\n<p><em>suite<\/em>, <em>test<\/em> und <em>assert<\/em> sind Methoden des Testframeworks mocha.js, die automatisch mit dem Web Component Tester (kurz WCT genannt) geladen werden. Mit ihnen ist es nun m\u00f6glich, Unit-Tests zu formulieren. Diese werden vom Kommandozeilen-Client \u201ewct\u201c ausgef\u00fchrt, und zwar in allen installierten Browsern, f\u00fcr die Treiber zur Automatisierung vorhanden sind. Zur <i>Fernsteuerung <\/i>der Browser setzt der WCT Selenium ein.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Leaky-State-verhindern\"><\/span>Leaky State verhindern<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Ein Problem, das beim oben gezeigten Beispiel auftritt, ist der sog. <i>Leaky State <\/i>\u2013 das zu testende Element wird f\u00fcr die einzelnen Tests nicht zur\u00fcckgesetzt, es beh\u00e4lt also seinen internen Zustand, z.B. geladene Daten oder Einstellungen. Dadurch kann ein Testfall einen anderen beeinflussen und die Tests k\u00f6nnen beispielsweise nicht mehr in beliebiger Reihenfolge ausgef\u00fchrt werden. Nun w\u00e4re es nat\u00fcrlich m\u00f6glich, das Element vor jedem Test zur\u00fcckzusetzen. Doch wie es so oft im Polymer-Umfeld hei\u00dft: \u201eThere is a component for that\u201c. In diesem Fall hei\u00dft die erforderliche Komponente <i>test-fixture <\/i>und k\u00fcmmert sich darum, dass jeder Test mit exakt den selben Bedingungen startet:<\/p>\n<pre class=\"lang:xhtml decode:true\">&lt;test-fixture id=\"listView\"&gt;\r\n\r\n    &lt;template&gt;\r\n\r\n        &lt;ph-listview&gt;&lt;\/ph-listview&gt;\r\n\r\n    &lt;\/template&gt;\r\n\r\n&lt;\/test-fixture&gt;\r\n\r\n&lt;script&gt;\r\n\r\n    \/\/...\r\n\r\n    setup(function (done) {\r\n\r\n        elementToTest = fixture('listView');\r\n\r\n        done();\r\n\r\n    }<\/pre>\n<p><i>setup <\/i>wird vor jedem Test ausgef\u00fchrt und erzeugt mit der Hilfsmethode <i>fixture<\/i> f\u00fcr jeden Test eine neue Instanz der zu testenden Komponente, wie im Template der Fixture definiert.<\/p>\n<p>Durch eine Integration von Saucelabs ist es zus\u00e4tzlich m\u00f6glich, alle Komponenten-Tests auch in der Cloud in vielen verschiedenen Browsern auszuf\u00fchren, die lokal nicht installiert sind oder nicht installiert werden k\u00f6nnen.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Der-Deployment-Build\"><\/span>Der Deployment-Build<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Theoretisch sind mit Polymer entwickelte Webcomponents ohne irgendeine Form von Build-Prozess direkt in Web-Apps nutzbar \u2013 sie m\u00fcssen nur per &lt;link rel=&#8220;import&#8220; href=&#8220;\/pfad\/zur\/komponente.html&#8220;&gt; eingebunden werden. In der Praxis treten dabei allerdings verschiedene Probleme auf. Die gr\u00f6\u00dfte Schwierigkeit bildet dabei die Performance \u2013 wenn jede Komponente in einer eigenen Datei gespeichert ist, muss jeweils ein HTTP-Request ausgef\u00fchrt werden. Mit HTTP 1.1 bedeutet das f\u00fcr jede Komponente den Overhead einer eigenen TCP-Verbindung, zus\u00e4tzlich k\u00f6nnen nur 5 simultane Verbindungen zu einem Server erstellt werden. Je nach Geschwindigkeit der Internetanbindung des Nutzers kann so die Ladezeit einer Web-App enorm ansteigen. Das Tool Vulcanize, das in Build-Systeme wie gulp oder grunt integriert werden kann, schafft Abhilfe, indem es alle verwendeten Komponenten zu einer einzelnen Datei zusammenfasst, die mit einem einzelnen HTTP-Request vom Browser geladen werden kann. Zus\u00e4tzlich wird HTML und Javascript-Code minifiziert, d.h. Whitespaces werden entfernt und Variablennamen werden auf m\u00f6glichst wenige Zeichen verk\u00fcrzt. Durch die Link-Elemente in den einzelnen Komponenten, die die Abh\u00e4ngigkeiten zwischen den Komponenten genau beschreiben, ist es m\u00f6glich, nur die Komponenten in die resultierende HTML-Datei zu laden, die wirklich ben\u00f6tigt werden. So muss, wenn eine Komponenten-Bibliothek wie die Paper-Elemente verwendet wird, nicht die ganze Bibliothek eingebunden werden, wenn nur einige wenige Komponenten wirklich genutzt werden.<\/p>\n<p>Ein Problem an einer zusammengefassten Datei, die HTML und Javascript-Code beinhaltet, ist die Verletzung der Content Security Policy (CSP). Diese Ma\u00dfnahme zur Erh\u00f6hung der Sicherheit von Webapps sieht vor, dass eingebundenes Javascript nur aus dedizierten Javascript-Dateien (also kein Inline-Javascript) von vertrauensw\u00fcrdigen Dom\u00e4nen stammt. Auf diese Weise sollen Cross-Site-Scripting-Angriffe verhindert werden. Das Tool Crisper erg\u00e4nzt Vulcanize und k\u00fcmmert sich um die Einhaltung von CSP, indem es alle Javascript-Snippets der einzelnen Komponenten zusammenf\u00fchrt und so HTML und Javascript trennt. Dadurch m\u00fcssen zwar zum Laden der Web-App 2 getrennte HTTP-Requests durchgef\u00fchrt werden, diese k\u00f6nnen jedoch parallelisiert werden und verz\u00f6gern daher den Aufbau der Seite nicht wesentlich. Zur einfacheren Verwendung ist Vulcanize und Crisper in Polybuild zusammengefasst \u2013 die Konfiguration der Build-Chain vereinfacht sich so.<\/p>\n<p>Es w\u00e4re noch denkbar, auch die CSS-Skripte zu minifizieren, allerdings muss dies mit Vorsicht getan werden, da Polymer CSS mit Selektoren wie :host und Funktionen wie @apply() erweitert, die u.U. nicht korrekt minifziert werden, da die Tools sie nicht kennen.<\/p>\n<p>Bevor jedoch der Build \u00fcberhaupt ausgef\u00fchrt wird, sollte die Richtigkeit des eigenen Codes sichergestellt werden. Dies kann zum einen durch Ausf\u00fchren von Unit-Tests mit dem Web Component Tester geschehen. Zum anderen ist es m\u00f6glich, den Code auf verd\u00e4chtige Stellen zu untersuchen, die wahrscheinlich nicht so funktionieren wie von dem\/der Programmierer:in beabsichtigt (sog. Code-Smells). Im Kontext von Polymer gibt es daf\u00fcr das Tool polylint, das zum Beispiel Referenzen pr\u00fcft (sind in Templates verwendete Funktionen \u00fcberhaupt definiert?) oder die korrekte Verwendung der Polymer-Bibliothek validiert (sind ben\u00f6tigte Attribute gesetzt?). So k\u00f6nnen gerade bei unerfahrenen Polymer-Entwicklern Fehler fr\u00fch erkannt werden.<\/p>\n<p>Momentan noch in der Entwicklung befindet sich ein Tool, um <a href=\"https:\/\/www.polymer-project.org\/1.0\/docs\/#pre-processing-stylesheets\" target=\"_blank\" rel=\"noopener\">Polymer-Stylesheets zu normalem CSS zu kompilieren<\/a>, damit dieser Schritt nicht die Startup-Zeit im Browser erh\u00f6ht.\u00a0N\u00e4here Informationen zu diesem Tool, das die Build-Chain erg\u00e4nzen k\u00f6nnte, sind zum gegenw\u00e4rtigen Zeitpunkt noch nicht verf\u00fcgbar.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-large wp-image-1535\" src=\"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/build-chain-1024x348.jpg\" alt=\"Polymer Build Chain\" width=\"800\" height=\"272\" \/><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Documentation-driven-Development\"><\/span>Documentation-driven Development<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Auch die beste Komponente bringt keinen Mehrwert, wenn niemand wei\u00df, wie diese verwendet werden kann. Da das Teilen bzw. Wiederverwenden von Komponenten der Grundgedanke von Webcomponents ist, wird im Polymer-\u00d6kosystem besonders viel Wert darauf gelegt, die Dokumentation und Bereitstellung von eigenen Komponenten m\u00f6glichst einfach und schmerzlos zu gestalten \u2013 auf diese Weise bilden sich schnell gro\u00dfe Bibliotheken von Komponenten und Entwickler:innen k\u00f6nnen sich auf die spezifischen Teile ihrer Anwendungen konzentrieren und sich nicht gezwungen, das Rad immer wieder neu erfinden zu m\u00fcssen. Wenn zuerst die Dokumentation einer API oder Komponente und erst danach die Implementierung erstellt wird, spricht man von Documentation driven Development (DDD). Durch die bereitgestellten Tools des Polymer-Toolset soll ein solcher Entwicklungsstil einfacher gemacht und belohnt werden. Auch hier hei\u00dft es: \u201eThere is a component for hat\u201c \u2013 die Komponente iron-component-page erstellt f\u00fcr eine gegebene Komponente automatisch eine (ebenfalls auf Polymer basierende) Dokumentations-Seite mitsamt funktionierender Demo. Inhalte der Seite werden automatisch aus HTML-Kommentaren und Javascript-Kommentaren aus dem Quellcode der Komponente geladen:<\/p>\n<pre class=\"lang:xhtml decode:true\">&lt;html lang=\"\"&gt;\r\n\r\n    &lt;head&gt;\r\n\r\n        &lt;script src=\"..\/webcomponentsjs\/webcomponents.js\"&gt;&lt;\/script&gt;\r\n\r\n        &lt;link rel=\"import\" href=\"..\/polymer\/polymer.html\"&gt;\r\n\r\n        &lt;link rel=\"import\" href=\"..\/iron-component-page\/iron-component-page.html\"&gt;\r\n\r\n    &lt;\/head&gt;\r\n\r\n    &lt;body unresolved&gt;\r\n\r\n        &lt;iron-component-page&gt;&lt;\/iron-component-page&gt;\r\n\r\n    &lt;\/body&gt;\r\n\r\n&lt;\/html&gt;<\/pre>\n<p>Die Dokumentation kann in Markdown verfasst werden, so sind auch komplexe Dokumente m\u00f6glich. Wird eine Demo im gleichen Verzeichnis gefunden, so wird diese auch mit eingebunden. Mithilfe des Scripts gp.sh\u00a0oder dem Befehl gh im Polymer-Yeoman-Generator (yo polymer:gh) l\u00e4sst sich diese Dokumentation automatisch als Github-Page ver\u00f6ffentlichen \u2013 die Schwelle, eine ansprechende und einheitliche Dokumentation f\u00fcr die selbst erstelle Komponente zu ver\u00f6ffentlichen, ist also so niedrig wie m\u00f6glich gelegt.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"UI-Design-in-Polymer\"><\/span>UI-Design in Polymer<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Wenn komplexe Oberfl\u00e4chen mit Polymer-Komponenten umgesetzt werden, ist es oft unpraktisch, das Layout in Code zu formulieren, das Ergebnis im Browser zu betrachten und dann wieder den Code anzupassen. Tools, bei denen Oberfl\u00e4chen auf grafischem Wege entwickelt werden k\u00f6nnen, schlie\u00dfen die Feedback-Schleife und machen die Bearbeitung so einfacher und intuitiver. F\u00fcr die native App-Entwicklung existieren solche Tools in Xcode und Android Studio. Mit dem Polymer Designer gibt es auch f\u00fcr auf Webkomponenten basierende Web-Apps ein entsprechendes Gegenst\u00fcck. F\u00fcr Polymer 1.0 wurde ein komplett neues Programm (Designer 2) begonnen, das sich noch in der aktiven Entwicklung befindet. F\u00fcr Polymer 0.5 Elemente gibt es mit Designer 1 bereits eine nutzbare Version. Der Designer ist selbst als Web-App implementiert, kann aber mithilfe des Electron-Frameworks als herk\u00f6mmliches Programm installiert werden. Dabei wird die gleiche technische Grundlage wie f\u00fcr Githubs Open Source Editor Atom genutzt.<\/p>\n<p>Viele auf Polymer basierende Webapps nutzen die Paper-Elemente, da sie so ohne Aufw\u00e4nde ein ansprechendes, auf <a href=\"https:\/\/www.google.com\/design\/spec\/material-design\/introduction.html\" target=\"_blank\" rel=\"noopener\">Material Design<\/a> basierendes Layout generieren k\u00f6nnen. Um die Standard-Material-Design-Farben anzupassen und ein ansprechendes Farbschema zu w\u00e4hlen, kann auf\u00a0<a href=\"http:\/\/www.materialpalette.com\" target=\"_blank\" rel=\"noopener\">www.materialpalette.com<\/a> zur\u00fcckgegriffen werden. Diese Website generiert automatisch aus einem gew\u00e4hlten Farbschema eine HTML-Datei, die in die eigene Polymer-App eingebunden werden kann und das Aussehen f\u00fcr alle Paper-Elemente von einer zentralen Stelle aus \u00e4ndert.<\/p>\n<pre class=\"lang:xhtml decode:true \">&lt;!-- Palette generated by Material Palette - materialpalette.com\/blue-grey\/grey --&gt;\r\n\r\n&lt;!-- Replace the one that comes in their starter kit --&gt;\r\n\r\n&lt;style is=\"custom-style\"&gt;\r\n\r\n:root {\r\n\r\n--dark-primary-color: #455A64;\r\n\r\n--default-primary-color: #607D8B;\r\n\r\n--light-primary-color: #CFD8DC;\r\n\r\n--text-primary-color: #FFFFFF;\r\n\r\n--accent-color: #9E9E9E;\r\n\r\n--primary-background-color: #CFD8DC;\r\n\r\n--primary-text-color: #212121;\r\n\r\n--secondary-text-color: #727272;\r\n\r\n--disabled-text-color: #BDBDBD;\r\n\r\n--divider-color: #B6B6B6;\r\n\r\n\/* Components *\/\r\n\r\n\/* paper-drawer-panel *\/\r\n\r\n--drawer-menu-color: #ffffff;\r\n\r\n--drawer-border-color: 1px solid #ccc;\r\n\r\n--drawer-toolbar-border-color: 1px solid rgba(0, 0, 0, 0.22);\r\n\r\n\/* paper-menu *\/\r\n\r\n--paper-menu-background-color: #fff;\r\n\r\n--menu-link-color: #111111;\r\n\r\n\/* paper-input *\/\r\n\r\n--paper-input-container-color: rgba(255, 255, 255, 0.64);\r\n\r\n--paper-input-container-focus-color: rgba(255, 255, 255, 1);\r\n\r\n--paper-input-container-input-color: #fff;\r\n\r\n}\r\n\r\n&lt;\/style&gt;<\/pre>\n<p>Die hier definierten Styles werden automatisch von den Paper-Elementen importiert und \u00fcberschreiben die Default-Styles.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Component-Hosting-leicht-gemacht\"><\/span>Component-Hosting leicht gemacht<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Es ist oft praktisch, ein Content-Delivery-Network zu nutzen, um externe Abh\u00e4ngigkeiten einer Web-App aufzul\u00f6sen \u2013 der Aufwand, die Abh\u00e4ngigkeiten selbst zu hosten, entf\u00e4llt; bei gro\u00dffl\u00e4chiger Verbreitung haben viele User bereits die Abh\u00e4ngigkeit von Besuchen anderer Websites im Browser-Cache und es stehen weltweit performante Server zur Verf\u00fcgung \u2013 auf diese Weise wird die Web-App schnell geladen. Polygit bietet ein einheitliches Interface, das beliebige auf Github gehostete Komponenten als CDN bereitstellt. So l\u00e4dt beispielsweise die folgende URL die Paper-Button Komponente in Version 1.0.2 :<\/p>\n<p><a href=\"http:\/\/polygit.org\/paper-button+v1.0.2\/components\/paper-button\/paper-button.html\" target=\"_blank\" rel=\"noopener\">http:\/\/polygit.org\/paper-button+v1.0.2\/components\/paper-button\/paper-button.html<\/a><\/p>\n<p>Der Aufbau der URL ist dabei wie folgt: \/[&lt;configurations&gt;\/]components\/&lt;component&gt;\/&lt;path&gt;<\/p>\n<p>&lt;component&gt; und &lt;path&gt; spezifizieren die geladene Komponente und den Pfad innerhalb des Repositories der Komponente, &lt;configurations &gt; sind eine oder mehrere Repositories (mit \/ getrennt), in denen nach &lt;component&gt; gesucht wird. Zus\u00e4tzlich kann die Version angegeben werden, * steht f\u00fcr das neueste Release. Die &lt;configuration&gt; super-gif+sjmiles+* w\u00fcrde also zum Repository super-gif der Organisation sjmiles in der neuesten Version aufgel\u00f6st werden. Da der Anfang der Import-URLs immer derselbe ist, empfehlen die Polygit-Entwickler:innen, mithilfe des base-Tags den Pfad-Prefix f\u00fcr Includes festzulegen und beim tats\u00e4chlichen include nur noch den Komponenten-Namen anzugeben, der anschlie\u00dfend automatisch aus den angegebenen Repositories ausgew\u00e4hlt wird:<\/p>\n<pre class=\"lang:xhtml decode:true\">&lt;base href=\"http:\/\/polygit.org\/polymer+v1.0.3\/vellum-*+sjmiles+*\/components\/\"&gt;\r\n\r\n&lt;link href=\"polymer\/polymer.html\" rel=\"import\"&gt;\r\n\r\n&lt;link href=\"vellum-grid\/vellum-grid.html\" rel=\"import\"&gt;<\/pre>\n<p>Polygit ist mit Vorsicht zu nutzen, da es zwar die Vorteile eines CDNs f\u00fcr die Auslieferung eigener Komponenten (hohe Bandbreite und Georedundanz) bietet, aber auch die Nutzung von Tools wie Polybuild, die Komponenten zusammenfassen, verhindert \u2013 mit Polygit muss f\u00fcr jede Komponente mindestens ein HTTP-Request durchgef\u00fchrt werden. Es muss von Fall zu Fall entschieden werden, ob sich die Verwendung dieses Tools lohnt.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-1536 size-large\" src=\"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-873x1024.png\" alt=\"Polygit\" width=\"800\" height=\"938\" srcset=\"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-873x1024.png 873w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-256x300.png 256w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-768x900.png 768w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-1310x1536.png 1310w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-1747x2048.png 1747w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-400x469.png 400w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit-360x422.png 360w, https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polygit.png 1920w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Links-Literatur\"><\/span>Links &amp; Literatur<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<ul>\n<li><a href=\"https:\/\/github.com\/PolymerElements\/polymer-starter-kit\/releases\">https:\/\/github.com\/PolymerElements\/polymer-starter-kit\/releases<\/a><\/li>\n<li><a href=\"https:\/\/www.polymer-project.org\/1.0\/docs\/#pre-processing-stylesheets\">https:\/\/www.polymer-project.org\/1.0\/docs\/#pre-processing-stylesheets<\/a><\/li>\n<li><a href=\"http:\/\/polygit.org\/\">http:\/\/polygit.org\/<\/a><\/li>\n<li><a href=\"https:\/\/github.com\/Polymer\/web-component-tester\">https:\/\/github.com\/Polymer\/web-component-tester<\/a><\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"Were-hiring\"><\/span>We&#8217;re hiring!<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Tapetenwechsel gef\u00e4llig? Wir sind auf der Suche nach begeisterten Frontend-Entwickler:innen, die unsere Projektteams im Umfeld von JavaScript, HTML und CSS unterst\u00fctzen und auch vor innovativen Themen wie AngularJS und Progressive Web Apps nicht zur\u00fcckschrecken. <strong>Jetzt Bewerben!<\/strong><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Weiterlesen\"><\/span>Weiterlesen<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Mehr Informationen zu unseren Dienstleistungen rund um die Web-Entwicklung gibt es <a href=\"https:\/\/www.inovex.de\/de\/leistungen\/mobile\/mobile-web\/\" target=\"_blank\" rel=\"noopener\">auf unserer Website<\/a>. Unser Portfolio umfasst au\u00dferdem die <a href=\"https:\/\/www.inovex.de\/de\/leistungen\/mobile\/app-entwicklung\/\" target=\"_blank\" rel=\"noopener\">Anwendungsentwicklung f\u00fcr Android &amp; iOS<\/a> mit speziellem Fokus auf <a href=\"https:\/\/www.inovex.de\/de\/leistungen\/mobile\/mobile-enterprise\/\" target=\"_blank\" rel=\"noopener\">Enterprise-Apps<\/a>. F\u00fcr direkten Kontakt schreibt an <a href=\"mailto:info@inovex.de\" target=\"_blank\" rel=\"noopener\">info@inovex.de<\/a> oder ruft an unter <a href=\"tel:+497216190210\" target=\"_blank\" rel=\"noopener\">+49 721 619 021-0<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nachdem mit Polymer 1.0 eine stabile Basis f\u00fcr produktive Anwendung der Bibliothek geschaffen wurde, ist es die Top-Priorit\u00e4t des Entwickler:innen-Teams, das Tooling rund um Polymer zu verbessern, damit Polymer nicht nur theoretisch, sondern auch praktisch zur Entwicklung von modernen Webapps eingesetzt wird. Dabei stehen generell nicht nur Entwicklungsgeschwindigkeit und Performance sondern auch die Wiederverwendbarkeit und [&hellip;]<\/p>\n","protected":false},"author":38,"featured_media":12443,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"ep_exclude_from_search":false,"footnotes":""},"tags":[70],"service":[420],"coauthors":[{"id":38,"display_name":"Johannes Reuter","user_nicename":"jreuter"}],"class_list":["post-21015","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-web","service-apps"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Polymer Tooling - inovex GmbH<\/title>\n<meta name=\"description\" content=\"Es werden Tools aufgezeigt, die den Gebrauch von Polymer im Entwickleralltag vereinfachen und ein prototypischer Workflow mit Build-Chain skizziert.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Polymer Tooling - inovex GmbH\" \/>\n<meta property=\"og:description\" content=\"Es werden Tools aufgezeigt, die den Gebrauch von Polymer im Entwickleralltag vereinfachen und ein prototypischer Workflow mit Build-Chain skizziert.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/\" \/>\n<meta property=\"og:site_name\" content=\"inovex GmbH\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/inovexde\" \/>\n<meta property=\"article:published_time\" content=\"2016-03-30T08:48:39+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-17T07:00:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild.png\" \/>\n\t<meta property=\"og:image:width\" content=\"4600\" \/>\n\t<meta property=\"og:image:height\" content=\"1356\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Johannes Reuter\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild-1024x302.png\" \/>\n<meta name=\"twitter:creator\" content=\"@inovexgmbh\" \/>\n<meta name=\"twitter:site\" content=\"@inovexgmbh\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Johannes Reuter\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"13\u00a0Minuten\" \/>\n\t<meta name=\"twitter:label3\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data3\" content=\"Johannes Reuter\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/\"},\"author\":{\"name\":\"Johannes Reuter\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#\\\/schema\\\/person\\\/2e7c8f474580d46832a7666b61f8c1ec\"},\"headline\":\"Polymer Tooling\",\"datePublished\":\"2016-03-30T08:48:39+00:00\",\"dateModified\":\"2026-03-17T07:00:07+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/\"},\"wordCount\":2169,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.inovex.de\\\/wp-content\\\/uploads\\\/2016\\\/03\\\/polymer-tooling-artikelbild.png\",\"keywords\":[\"Web\"],\"articleSection\":[\"Applications\",\"General\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/\",\"url\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/\",\"name\":\"Polymer Tooling - inovex GmbH\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.inovex.de\\\/wp-content\\\/uploads\\\/2016\\\/03\\\/polymer-tooling-artikelbild.png\",\"datePublished\":\"2016-03-30T08:48:39+00:00\",\"dateModified\":\"2026-03-17T07:00:07+00:00\",\"description\":\"Es werden Tools aufgezeigt, die den Gebrauch von Polymer im Entwickleralltag vereinfachen und ein prototypischer Workflow mit Build-Chain skizziert.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.inovex.de\\\/wp-content\\\/uploads\\\/2016\\\/03\\\/polymer-tooling-artikelbild.png\",\"contentUrl\":\"https:\\\/\\\/www.inovex.de\\\/wp-content\\\/uploads\\\/2016\\\/03\\\/polymer-tooling-artikelbild.png\",\"width\":4600,\"height\":1356,\"caption\":\"Polymer Tooling\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/polymer-tooling\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Polymer Tooling\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#website\",\"url\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/\",\"name\":\"inovex GmbH\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#organization\",\"name\":\"inovex GmbH\",\"url\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.inovex.de\\\/wp-content\\\/uploads\\\/2021\\\/03\\\/inovex-logo-16-9-1.png\",\"contentUrl\":\"https:\\\/\\\/www.inovex.de\\\/wp-content\\\/uploads\\\/2021\\\/03\\\/inovex-logo-16-9-1.png\",\"width\":1921,\"height\":1081,\"caption\":\"inovex GmbH\"},\"image\":{\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/inovexde\",\"https:\\\/\\\/x.com\\\/inovexgmbh\",\"https:\\\/\\\/www.instagram.com\\\/inovexlife\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/inovex\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UC7r66GT14hROB_RQsQBAQUQ\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/#\\\/schema\\\/person\\\/2e7c8f474580d46832a7666b61f8c1ec\",\"name\":\"Johannes Reuter\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4cd215069ed19f8429692365d40f5a8e94a674eea57579c97b182c853c9cd0d0?s=96&d=retro&r=g6e76acaf394b88ba3914670bfc4db231\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4cd215069ed19f8429692365d40f5a8e94a674eea57579c97b182c853c9cd0d0?s=96&d=retro&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4cd215069ed19f8429692365d40f5a8e94a674eea57579c97b182c853c9cd0d0?s=96&d=retro&r=g\",\"caption\":\"Johannes Reuter\"},\"url\":\"https:\\\/\\\/www.inovex.de\\\/de\\\/blog\\\/author\\\/jreuter\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Polymer Tooling - inovex GmbH","description":"Es werden Tools aufgezeigt, die den Gebrauch von Polymer im Entwickleralltag vereinfachen und ein prototypischer Workflow mit Build-Chain skizziert.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/","og_locale":"de_DE","og_type":"article","og_title":"Polymer Tooling - inovex GmbH","og_description":"Es werden Tools aufgezeigt, die den Gebrauch von Polymer im Entwickleralltag vereinfachen und ein prototypischer Workflow mit Build-Chain skizziert.","og_url":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/","og_site_name":"inovex GmbH","article_publisher":"https:\/\/www.facebook.com\/inovexde","article_published_time":"2016-03-30T08:48:39+00:00","article_modified_time":"2026-03-17T07:00:07+00:00","og_image":[{"width":4600,"height":1356,"url":"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild.png","type":"image\/png"}],"author":"Johannes Reuter","twitter_card":"summary_large_image","twitter_image":"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild-1024x302.png","twitter_creator":"@inovexgmbh","twitter_site":"@inovexgmbh","twitter_misc":{"Verfasst von":"Johannes Reuter","Gesch\u00e4tzte Lesezeit":"13\u00a0Minuten","Written by":"Johannes Reuter"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#article","isPartOf":{"@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/"},"author":{"name":"Johannes Reuter","@id":"https:\/\/www.inovex.de\/de\/#\/schema\/person\/2e7c8f474580d46832a7666b61f8c1ec"},"headline":"Polymer Tooling","datePublished":"2016-03-30T08:48:39+00:00","dateModified":"2026-03-17T07:00:07+00:00","mainEntityOfPage":{"@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/"},"wordCount":2169,"commentCount":0,"publisher":{"@id":"https:\/\/www.inovex.de\/de\/#organization"},"image":{"@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#primaryimage"},"thumbnailUrl":"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild.png","keywords":["Web"],"articleSection":["Applications","General"],"inLanguage":"de","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/","url":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/","name":"Polymer Tooling - inovex GmbH","isPartOf":{"@id":"https:\/\/www.inovex.de\/de\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#primaryimage"},"image":{"@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#primaryimage"},"thumbnailUrl":"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild.png","datePublished":"2016-03-30T08:48:39+00:00","dateModified":"2026-03-17T07:00:07+00:00","description":"Es werden Tools aufgezeigt, die den Gebrauch von Polymer im Entwickleralltag vereinfachen und ein prototypischer Workflow mit Build-Chain skizziert.","breadcrumb":{"@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#primaryimage","url":"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild.png","contentUrl":"https:\/\/www.inovex.de\/wp-content\/uploads\/2016\/03\/polymer-tooling-artikelbild.png","width":4600,"height":1356,"caption":"Polymer Tooling"},{"@type":"BreadcrumbList","@id":"https:\/\/www.inovex.de\/de\/blog\/polymer-tooling\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.inovex.de\/de\/"},{"@type":"ListItem","position":2,"name":"Polymer Tooling"}]},{"@type":"WebSite","@id":"https:\/\/www.inovex.de\/de\/#website","url":"https:\/\/www.inovex.de\/de\/","name":"inovex GmbH","description":"","publisher":{"@id":"https:\/\/www.inovex.de\/de\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.inovex.de\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/www.inovex.de\/de\/#organization","name":"inovex GmbH","url":"https:\/\/www.inovex.de\/de\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.inovex.de\/de\/#\/schema\/logo\/image\/","url":"https:\/\/www.inovex.de\/wp-content\/uploads\/2021\/03\/inovex-logo-16-9-1.png","contentUrl":"https:\/\/www.inovex.de\/wp-content\/uploads\/2021\/03\/inovex-logo-16-9-1.png","width":1921,"height":1081,"caption":"inovex GmbH"},"image":{"@id":"https:\/\/www.inovex.de\/de\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/inovexde","https:\/\/x.com\/inovexgmbh","https:\/\/www.instagram.com\/inovexlife\/","https:\/\/www.linkedin.com\/company\/inovex","https:\/\/www.youtube.com\/channel\/UC7r66GT14hROB_RQsQBAQUQ"]},{"@type":"Person","@id":"https:\/\/www.inovex.de\/de\/#\/schema\/person\/2e7c8f474580d46832a7666b61f8c1ec","name":"Johannes Reuter","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/secure.gravatar.com\/avatar\/4cd215069ed19f8429692365d40f5a8e94a674eea57579c97b182c853c9cd0d0?s=96&d=retro&r=g6e76acaf394b88ba3914670bfc4db231","url":"https:\/\/secure.gravatar.com\/avatar\/4cd215069ed19f8429692365d40f5a8e94a674eea57579c97b182c853c9cd0d0?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4cd215069ed19f8429692365d40f5a8e94a674eea57579c97b182c853c9cd0d0?s=96&d=retro&r=g","caption":"Johannes Reuter"},"url":"https:\/\/www.inovex.de\/de\/blog\/author\/jreuter\/"}]}},"_links":{"self":[{"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/posts\/21015","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/users\/38"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/comments?post=21015"}],"version-history":[{"count":5,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/posts\/21015\/revisions"}],"predecessor-version":[{"id":66542,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/posts\/21015\/revisions\/66542"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/media\/12443"}],"wp:attachment":[{"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/media?parent=21015"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/tags?post=21015"},{"taxonomy":"service","embeddable":true,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/service?post=21015"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.inovex.de\/de\/wp-json\/wp\/v2\/coauthors?post=21015"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}