{"id":268629,"date":"2021-06-07T19:00:47","date_gmt":"2021-06-07T16:00:47","guid":{"rendered":"https:\/\/en.buradabiliyorum.com\/why-does-webassembly-matter-cloudsavvy-it\/"},"modified":"2021-06-07T19:00:47","modified_gmt":"2021-06-07T16:00:47","slug":"why-does-webassembly-matter-cloudsavvy-it","status":"publish","type":"post","link":"https:\/\/buradabiliyorum.com\/en\/why-does-webassembly-matter-cloudsavvy-it\/","title":{"rendered":"#Why Does WebAssembly Matter? \u2013 CloudSavvy IT"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_84 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6a276ad436d50\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #dd3333;color:#dd3333\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #dd3333;color:#dd3333\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6a276ad436d50\" checked aria-label=\"Toggle\" \/><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:\/\/buradabiliyorum.com\/en\/why-does-webassembly-matter-cloudsavvy-it\/#Why_Does_Wasm_Actually_Matter\" >Why Does Wasm Actually Matter?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/buradabiliyorum.com\/en\/why-does-webassembly-matter-cloudsavvy-it\/#Do_We_Need_More_Web_Performance\" >Do We Need More Web Performance?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/buradabiliyorum.com\/en\/why-does-webassembly-matter-cloudsavvy-it\/#Increasing_Developer_Choice\" >Increasing Developer Choice<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/buradabiliyorum.com\/en\/why-does-webassembly-matter-cloudsavvy-it\/#Facilitating_Code_Reuse\" >Facilitating Code Reuse<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/buradabiliyorum.com\/en\/why-does-webassembly-matter-cloudsavvy-it\/#Summary\" >Summary<\/a><\/li><\/ul><\/nav><\/div>\n<p><strong>&#8220;#Why Does WebAssembly Matter? \u2013 CloudSavvy IT&#8221;<\/strong><\/p>\n<div id=\"article-content-area\">\n<figure style=\"width: 1856px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"type:primaryImage wp-image-11794 size-full\" data-pagespeed-lazy-src=\"https:\/\/www.cloudsavvyit.com\/p\/uploads\/2021\/05\/6813a81f.png?width=1198&amp;trim=1,1&amp;bg-color=000&amp;pad=1,1\" alt=\"web programming\" width=\"1856\" height=\"1036\" src=\"\/pagespeed_static\/1.JiBnMqyl6S.gif\" onload=\"pagespeed.lazyLoadImages.loadIfVisibleAndMaybeBeacon(this);\" onerror=\"this.onerror=null;pagespeed.lazyLoadImages.loadIfVisibleAndMaybeBeacon(this);\"\/><figcaption class=\"wp-caption-text\"><span class=\"type:primaryImage imagecredit\"><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.shutterstock.com\/image-vector\/software-web-development-programming-concept-abstract-1122339353\">Shutterstock\/Andrey Suslov<\/a><\/span><\/figcaption><\/figure>\n<p><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/webassembly.org\">WebAssembly<\/a>\u00a0is a binary-instruction format that can be executed in web browsers. It provides a sandboxed execution environment with near-native performance, eliminating most of the overheads associated with Java<a href=\"https:\/\/buradabiliyorum.com\/en\/category\/download-scripts-themes-apps\/\" data-internallinksmanager029f6b8e52c=\"9\" title=\"Download Scripts &amp; Themes &amp; Apps\" target=\"_blank\" rel=\"noopener\">Script<\/a> on web pages.<\/p>\n<p>WebAssembly (Wasm) is low-level machine code that runs in a stack-based virtual machine. This means that it\u2019s much closer to your hardware than JavaScript. That needs to be parsed and fully interpreted before it can run.<\/p>\n<p>Creating Wasm is a bit more involved than writing JavaScript. Although you can hand-code it in <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/webassembly.github.io\/spec\/core\/text\/index.html\">Wasm Text Format<\/a>, this is low level and equivalent to writing assembly code for native execution. More often, you\u2019ll write in an established programming language and compile to Wasm. (More on that later.)<\/p>\n<h2 id=\"why-does-wasm-actually-matter\"><span class=\"ez-toc-section\" id=\"Why_Does_Wasm_Actually_Matter\"><\/span>Why Does Wasm Actually Matter?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>If the increase in rich web applications is anything to go by, developers, by and large, are pretty comfortable with writing JavaScript. It\u2019s evolved considerably over the past decade with new syntax features and improvements in browser performance. These have elevated it from simple scripts to a language that\u2019s capable of supporting complex, self-contained applications. Why is WebAssembly needed, then?<\/p>\n<p>Wasm doesn\u2019t replace JavaScript. It\u2019s targeted at specific use cases where JavaScript is still a hindrance and will possibly always be. Of these cases, performance is where Wasm particularly excels.<\/p>\n<p>JavaScript-heavy websites have a tendency to feel sluggish and eat up memory. This is especially noticeable on mobile devices, where web apps still lack the \u201cfeel\u201d of their native counterparts.<\/p>\n<p>Because Wasm sits so much closer to the hardware, it offers a level of performance that\u2019s barely distinguishable from native apps. This opens the web to a new class of performance-critical applications. If it runs on your desktop, it could run in the browser without any perceptible performance slowdown.<\/p>\n<h2 id=\"do-we-need-more-web-performance\"><span class=\"ez-toc-section\" id=\"Do_We_Need_More_Web_Performance\"><\/span>Do We Need More Web Performance?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>There will always be an argument that some apps are simply best suited to desktop use. The web provides its own benefits, though, particularly around broad distribution.<\/p>\n<p>Publishing your app on the web gives you the widest possible audience. Anyone can access it from whichever device they own. This increases convenience for your users and means that you have one codebase to maintain.<\/p>\n<p>The real question isn\u2019t whether we need more web performance: Instead, we should be asking whether we need more applications on the web. To answer that question, we can look to functionality-heavy sites that have already adopted Wasm.<\/p>\n<p>AutoCAD is computer-aided design software for architects and engineers. The latest web version debuted at Google I\/O in 2018. It <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.anrdoezrs.net\/links\/3607085\/type\/am\/sid\/11568\/https:\/\/blogs.autodesk.com\/autocad\/autocad-web-app-google-io-2018\">uses Wasm<\/a> to consume components of the existing desktop codebase as is. Some of the code dates back 35 years but now runs in the browser.<\/p>\n<p>Another example is Figma, which already used the <a rel=\"nofollow noopener\" target=\"_blank\" href=\"http:\/\/asmjs.org\">asm.js<\/a> JavaScript subset to optimize its performance. By moving to Wasm, Figma noted a <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.figma.com\/blog\/webassembly-cut-figmas-load-time-by-3x\">3x performance improvement<\/a>. Google uses Wasm too, relying on it to bring Google Earth <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/medium.com\/google-earth\/google-earth-comes-to-more-browsers-thanks-to-webassembly-1877d95810d6\">onto the web<\/a> for all.<\/p>\n<p>These highly complex applications couldn\u2019t previously exist on the web. If they did, they ran with severe performance penalties compared with their desktop counterparts. Wasm is the architecture necessary to complete the web\u2019s transition from document-oriented pages to a complete application platform. You can even <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.infoq.com\/news\/2019\/07\/doom3-web-assembly-port\">play Doom 3<\/a>!<\/p>\n<h2 id=\"increasing-developer-choice\"><span class=\"ez-toc-section\" id=\"Increasing_Developer_Choice\"><\/span>Increasing Developer Choice<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Beyond performance, WebAssembly matters because it gives developers more flexibility and choice. Excluding the legacy of Flash, Java, and ActiveX plugins, JavaScript has been your only choice when writing code for the browser.<\/p>\n<p>That situation has now been transformed. WebAssembly is a low-level format that other languages compile to. C, C++, C#, Java, Python, Rust, and many more besides are capable of outputting WebAssembly modules. This gives developers many more options when creating code for the web.<\/p>\n<p>You still need JavaScript to <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/WebAssembly\/Loading_and_running\">load your Wasm modules,<\/a> but that\u2019s about it. You could implement all of your project\u2019s functionality using your chosen language, and then compile it down to Wasm for the browser.<\/p>\n<p>Developers can now write for the web in the language that best suits them and their application. That might be a strongly typed, object-oriented language, or something focused on functional programming. No longer are you restricted to JavaScript\u2019s loose typing and object prototypes.<\/p>\n<h2 id=\"facilitating-code-reuse\"><span class=\"ez-toc-section\" id=\"Facilitating_Code_Reuse\"><\/span>Facilitating Code Reuse<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>WebAssembly brings substantial benefits when it comes to code reuse. You can bring your shared libraries to the web without reimplementing them in JavaScript. This could save hours, days, or weeks of your time.<\/p>\n<p>Using C# as an example, you might have a .NET DLL that contains convenience methods used by your server-side code and your desktop application. Previously, you\u2019d need to implement those methods in JavaScript when it came time to build your web app.<\/p>\n<p>With Wasm, you can recompile your DLL using WebAssembly as the target. The <em>same<\/em> code becomes accessible in the browser. Wasm reduces waste and duplicate engineering by letting you use what you already have.<\/p>\n<p>Historically, this has only really been possible if your backend used Node.js. You could abstract common logic into a JavaScript library ready for reuse in the frontend. Now, you can work with libraries written in any language.<\/p>\n<p>This works even if you\u2019ll stick with JavaScript for the bulk of your web app. You can interface with Wasm modules through JavaScript, so you can still use your DLL of shared functions. Asynchronous APIs let you <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/WebAssembly\/Loading_and_running\">exchange data with Wasm<\/a> so that you can call functions and get their return values.<\/p>\n<h2 id=\"summary\"><span class=\"ez-toc-section\" id=\"Summary\"><\/span>Summary<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>WebAssembly is easily dismissed as an obscure <a href=\"https:\/\/buradabiliyorum.com\/en\/category\/technology\/\" data-internallinksmanager029f6b8e52c=\"4\" title=\"Technology\" target=\"_blank\" rel=\"noopener\">technology<\/a> with little relevance to today\u2019s web apps. Wasm is really targeting the web of tomorrow, where desktop-class apps will run with native performance.<\/p>\n<p>It\u2019s important to look beyond the headline benefits, too. Wasm isn\u2019t just about speed increases. It can also reduce time-to-ship for development teams, especially those that work cross-platform or share logic between the client and the server. Part of the excitement around WebAssembly derives from the web\u2019s transformation into a compilation target, instead of it being a completely standalone platform. Building for the browser no longer means writing JavaScript.<\/p>\n<p>Here, in 2021, WebAssembly adoption remains relatively low. Projects that use it have reported successes\u2014you only need to try Figma or Google Earth to appreciate the Wasm performance standard. You\u2019re likely to see more of Wasm over the next few years as apps, both new and old, are brought into the browser.\n<\/p><\/div>\n<blockquote><p><strong><span style=\"color: #ff6600;\">If you liked the article, do not forget to share it with your friends. Follow us on\u00a0<span style=\"color: #ff0000;\"><a style=\"color: #ff0000;\" href=\"https:\/\/news.google.com\/publications\/CAAqBwgKMLG0nwswvr63Aw\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Google News<\/a><\/span>\u00a0too, click on the star and choose us from your favorites.<\/span><\/strong><\/p><\/blockquote>\n<blockquote>\n<p style=\"text-align: center;\">For forums sites go to <span style=\"color: #ff9900;\"><a style=\"color: #ff9900;\" href=\"https:\/\/forum.buradabiliyorum.com\/\" target=\"_blank\" rel=\"noopener\">Forum.BuradaBiliyorum.Com<\/a><\/span><\/strong><\/p>\n<\/blockquote>\n<blockquote>\n<p style=\"text-align: center;\"><strong>If you want to read more like this article, you can visit our <span style=\"color: #ff9900;\"><a style=\"color: #ff9900;\" href=\"https:\/\/en.buradabiliyorum.com\/technology\/\" target=\"_blank\" rel=\"noopener\">Technology category.<\/a><\/span><\/strong><\/p>\n<\/blockquote>\n<p><span style=\"color: black;\"><a style=\"color: #ff9900;\" href=\"https:\/\/www.cloudsavvyit.com\/11568\/why-does-webassembly-matter\/\" target=\"_blank\" rel=\"noopener\">Source<\/a><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>&#8220;#Why Does WebAssembly Matter? \u2013 CloudSavvy IT&#8221; Shutterstock\/Andrey Suslov WebAssembly\u00a0is a binary-instruction format that can be executed in web browsers. It provides a sandboxed execution environment with near-native performance, eliminating most of the overheads associated with JavaScript on web pages. WebAssembly (Wasm) is low-level machine code that runs in a stack-based virtual machine. This means&#8230;<\/p>\n","protected":false},"author":1,"featured_media":268630,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"https:\/\/www.cloudsavvyit.com\/p\/uploads\/2021\/05\/6813a81f.png","fifu_image_alt":"","footnotes":""},"categories":[18],"tags":[],"class_list":["post-268629","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technology"],"_links":{"self":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/posts\/268629","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/comments?post=268629"}],"version-history":[{"count":0,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/posts\/268629\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/media\/268630"}],"wp:attachment":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/media?parent=268629"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/categories?post=268629"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/tags?post=268629"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}