{"id":1770,"date":"2014-07-18T00:00:00","date_gmt":"2014-07-17T22:00:00","guid":{"rendered":"https:\/\/wwwneu.strehle.de\/tim\/weblog\/archives\/2014\/07\/18\/1729\/"},"modified":"2014-07-18T00:00:00","modified_gmt":"2014-07-17T22:00:00","slug":"1729","status":"publish","type":"post","link":"https:\/\/www.strehle.de\/tim\/weblog\/archives\/2014\/07\/18\/1729\/","title":{"rendered":"Web app interoperability \u2013 the missing link"},"content":{"rendered":"<p>In <a href=\"http:\/\/www.cmswire.com\/cms\/digital-asset-management\/reinventing-digital-asset-management-025893.php\">Reinventing Digital Asset Management<\/a>, David Diamond writes about the miserable state of integration between DAM software and the places we want to use our digital assets \u2013 \u201cour apps and anywhere else we happen to be \u2014 Google plus, a Disqus comments thread, Facebook, Twitter, etc.\u201d Integration with native applications like Photoshop and InDesign is a special topic that I\u2019m trying to stay away from as a developer (not fun at all). But most of the apps we use live on the Web. How well do Web apps interoperate?<\/p>\n<p>A little story: As an \u201centerprise software\u201d shop, we do a lot of custom development. Each feature to be developed is described in our bug tracker software, including customer and project name. When the developer starts working on a feature, he changes the bug tracker record status from \u201copen\u201d to \u201cassigned\u201d (so that the project manager gets notified of the progress). We also have separate time tracking software. The developer starts a timer there \u2013 and has to manually enter the customer and project name, and a short feature description.<\/p>\n<p>Why doesn\u2019t the bug tracker have a simple \u201cstart tracking time\u201d link to the time tracker that prefills the required metadata? And a second link for a \u201cshow tracked time\u201d report (even better: show it inline)? How about a link from the time tracker to the bug tracker for the full feature description?<\/p>\n<p>In theory, this functionality should be trivial to implement. Both applications are Web based, they even have APIs \u2013 I just need to read some fields from their databases (hoping that the data structures are compatible) and inject an HTML snippet into their pages. Hey, I\u2019m a Web developer. How hard can it be?<\/p>\n<p>Actually, it\u2019s so hard that I don\u2019t bother doing it. Like most software, including DAM systems, these Web apps are not built for interoperability (or integration; <a href=\"http:\/\/amundsen.com\/blog\/archives\/1144\">here\u2019s the difference<\/a>). You\u2019re not supposed to mess with their HTML output. Software vendors are control freaks, they don\u2019t want you to add glue and features (in part because there are security and performance concerns). And they haven\u2019t architected their software for it (think abstractions, services, components). For example, had the WordPress guys wrapped the Media Library in a well-documented API, all DAM vendors could have swapped in their software much more easily and in the same way. Now each one has to handcraft their own WordPress integration.<\/p>\n<p>There are generic approaches to this problem, though. The <a href=\"https:\/\/www.dropbox.com\/developers\/dropins\/chooser\/js\">Dropbox Chooser<\/a> and <a href=\"https:\/\/developers.google.com\/picker\/\">Google Picker<\/a> are nice \u201cFile Open\u201d dialogs for the Web. <a href=\"http:\/\/en.wikipedia.org\/wiki\/Portlet\">Portlets<\/a> and <a href=\"https:\/\/developers.google.com\/gadgets\/\">Google Gadgets<\/a> let you embed \u201cforeign\u201d mini-apps (and for Sharepoint, there\u2019s <a href=\"http:\/\/en.wikipedia.org\/wiki\/Web_part\">Web Parts<\/a>). <a href=\"http:\/\/webcomponents.org\/\">Web Components<\/a> are a promising new technology that will probably replace all of the above. <a href=\"http:\/\/www.semantico.com\/2013\/09\/web-hooks-and-the-evented-web\/\">Webhooks<\/a> and <a href=\"http:\/\/webintents.org\/\">Web Intents<\/a> allow for clever links between Web apps.<\/p>\n<p>(For completeness, some historical background: Component based native software that allows relatively simple, Lego-like app construction was a hot topic twenty years ago. Remember Visual Basic, OLE, <a href=\"http:\/\/en.wikipedia.org\/wiki\/OpenDoc\">OpenDoc<\/a>, or Interface Builder on <a href=\"http:\/\/en.wikipedia.org\/wiki\/NeXTSTEP\">NeXT<\/a>? In Web technology, early <a href=\"http:\/\/en.wikipedia.org\/wiki\/Mashup_(web_application_hybrid)\">Mashups<\/a> were promising but they mostly remained one-off, short-lived demos.)<\/p>\n<p>It\u2019s wonderful that most information lives on the Web nowadays. The simple and open HTTP and HTML standards, and especially hyperlinks, allow us to build amazing connections. Let\u2019s make use of that potential and move <a href=\"\/tim\/weblog\/archives\/2014\/02\/25\/1697\">from DAM silos to a Web of information<\/a>!<\/p>\n<p><em>Update (2015-04-29):<\/em> Related: Stefan Tilkov on <a href=\"https:\/\/www.innoq.com\/blog\/st\/2014\/11\/web-based-frontend-integration\/\">Web-based frontend integration<\/a>. See also my earlier post <a href=\"\/tim\/weblog\/archives\/2013\/01\/15\/1548\">My thoughts on DAM value chains<\/a>.<\/p>\n<p><em>Update (2016-03-08):<\/em> Stefan Tilkov, again \u2013 <a href=\"https:\/\/www.innoq.com\/en\/talks\/2016\/03\/enhanceconf-embrace-browser\/\">Embrace the Browser, Architect\u2019s Edition<\/a> (or watch <a href=\"https:\/\/www.youtube.com\/watch?v=y8UsGSFz8IQ\">the video of his talk<\/a>). Excellent, and suits me well since <a href=\"\/tim\/weblog\/archives\/2014\/01\/15\/1678\">I never loved the SPA<\/a> (Single-page Web app).<\/p>\n<p><em>Update (2016-12-21):<\/em> The good old iframe and <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Window\/postMessage\">window.postMessage()<\/a> provide a simple means for Web page interop.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In Reinventing Digital Asset Management, David Diamond writes about the miserable state of integration between DAM software and the places we want to use our digital assets \u2013 \u201cour apps and anywhere else we happen to be \u2014 Google plus, a Disqus comments thread, Facebook, Twitter, etc.\u201d Integration with native applications like Photoshop and InDesign [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_share_on_mastodon":"0"},"categories":[1],"tags":[],"class_list":["post-1770","post","type-post","status-publish","format-standard","hentry","category-weblog"],"share_on_mastodon":{"url":"","error":""},"_links":{"self":[{"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/posts\/1770","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/comments?post=1770"}],"version-history":[{"count":0,"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/posts\/1770\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/media?parent=1770"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/categories?post=1770"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.strehle.de\/tim\/wp-json\/wp\/v2\/tags?post=1770"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}