Dynamic Content
Information Technology Is Our Domain
Front End Development - JavaScript Everywhere
Javascript ubiquitousness in today's frontend development should come as no surprise. If you’ve been involved in front end development over the past few years, you know that there’s more than enough to give someone ‘analysis paralysis’. New frameworks and libraries are popping up every so often. Companies all over the world are facing the daunting task of choosing the right stack for their digital implementation. That’s a big challenge, in addition to working hard to keep up with the latest trends at the same time.Even for some devoted front end developers, there comes a time when tech stack becomes a personal choice. This can take precedence over the tech selection being the right or wrong method to solve the problems. As the race continues to come up with the fastest, highest performing and easiest framework or library, one only wonders when will the JavaScript world consolidate into a few mainstream stacks? What does the future of JavaScript look like?
JavaScript Background & Prevalence
Since its inception in 1995, JavaScript has been growing into the most popular, dominant language of the web. Over the last decade, the adoption of JS has only been growing, showing no signs of abating. According to StackOverflow’s annual survey, 69.8% of respondents and 71.5% of professional developers are using JavaScript today. With the prevalence of more web-enabled devices, the race to come up with the best "one size fits all solution" grows bigger. This is great news for developers who either know JS or are planning to learn it. For those that are far from the front end world, suggestions are for them to try and gain (even basic) experience with it. This quote sums it up perfectly:This [JavaScript] is perhaps the hottest skill developers need to up-skill in for the foreseeable future
Frameworks & Web Components — The Foreseeable Future
After the framework wars of the last decade, The Big Three, as some like to call them, are leading the way to a more stable and defined future. React, Vue, and Angular are by far the most prominent frameworks and libraries of JavaScript used today. In this piece, we’ll go about sorting them in the order of prevalence and hope that they keep up and on leading into the future.React
Vue
Angular
Web components
Alongside Frameworks, we have recently seen a rise of web components, but what are they and why do they matter?
From a community suffering from frameworks fatigue, Web Components are the next biggest thing getting traction since HTML5. But what are they?
Web Components are a powerful new W3C Standard that’s already been agreed upon by all the major browsers and can be used today in our apps (with a polyfill). It’s an addition to the DOM that has the ability to turn the web into small, reusable and modular components, untied to any framework, but purely built with HTML, CSS, and JS’.
Web Components have small bundle sizes eliminating the need to ship a custom component implementation. They’re praised for their re-usability. Because web components are built into and supported natively in the browser they can be used anywhere, in any framework or with no framework at all. Finally, they are loved for their simplicity. There is no need to learn a certain framework if you don’t want to. If you already know basic JS and the basic DOM APIs, then you can interact with a web component.
Ionic/Stencil
Ionic is a powerful framework-agnostic library for building mobile and progressive web apps that have direct access to native device features. And with the latest Ionic 4 release, the introduction of Stencil will not only make it more powerful and performant by allowing developers to use it outside of Angular. How? Stencil is a web component compiler that builds modern web components that are fast and small. By creating our UI components with Web Components instead of Framework specific components like React or Angular we can reuse these components in any framework that supports them or all on their own.
Polymer
Polymer is a JS library developed by Google and used by Google Earth and Youtube. It uses web components to build web applications and provides the ability to compose enclosed JS, CSS, and HTML as custom elements while leveraging the browser’s native technologies rather than relying on JS libraries.
However, Polymer hasn’t reached maturity yet and presents a few challenges. First, since it produces DOM, then any interactions or DOM manipulation will be in basic JavaScript, which adds more boilerplate code, making the organizing and the managing of a larger application more challenging. A reason why React and other libraries came about. Second, Polymer created placeholders for variables in strings to improve performance and solve the problem of converting data to a string just to convert it back into an object. But by using these placeholders, you have tied your application explicitly to Polymer because the placeholder is not in the Web Component spec. The last couple of challenges are: downloading of entire library and Polyfills, and a lack of server-side rendering.
How will AI transform Front End Development
Beyond libraries and frameworks, how will AI and machine learning shape the future of front end development? It’s a question asked by many, but a few companies are already leading the charge. They’re using different techniques in hopes of disrupting a field that has gone through different cycles of frameworks and libraries. The approaches are divided into two.
One side aims at assisting developers by generating starting code from wireframes and sketch-files or generating an entire front end output. This helps developers focus on more important parts of development, such as application logic and building features. It speeds up the iteration of design phases and modifications. Those companies range from Airbnb who lately has built an AI that turns sketch files into raw code, to Uizard which uses a deep learning/ML (neural network) that they had trained to take a screenshot of graphic interface and translate it into lines of raw code. What’s impressive with Uizard is; a single textual to GUI renderer will work across multiple platforms such as iOS, Android and Web-based interfaces and the algorithm thus far works with a 77% accuracy.
Then Microsoft’s Ink to Code app, who also took a stab at this and made their software available to download for free from the Windows Store. And finally, Supernova, which is a startup on a mission to accelerate the app development workflow of mobile designers and developers built a tool, The Supernova Studio macOS app, which promises to automatically convert mobile app designs created in Sketch, into native UI code, aiming to bridge the gap between prototyping and design, and front end development.
The other side took AI a step further and are getting machines to do the entire front end coding. BAYOU, which is a project that was funded by the military and Google out of Rice University, uses a deep learning tool that basically works like a search engine for coding. Through reading the source code of 1500 Android apps (~100 million lines of Java), BAYOU’s neural net is now an AI that can program other software.
Where is Web-Assembly in all of this? A possible future
Web assembly is a binary format that can be natively decoded, in all browsers, much faster than JS can be parsed. This is a term that has been buzzing around in the developer community. It could actually become the most adopted in the near future as complement to JavaScript.
Why? Because it enables performance by reducing TTI (time to interactive) making for fast web application, as well as diversifying languages with which front end development can be written. This allows developers the usage of their favorite language or the ability to build a few parts of the web application with web assembly while boosting speed and leaving the rest of the application in JS.
Concluding Thoughts
The world of front end that we understand today is being dominated by three big frameworks; React, Vue and Angular (with Vue as the most promising of the three). However, knowing the past life cycles of frameworks, it will come as no surprise if a brand new framework comes along that is faster, more performant, and solves problems that existing frameworks are currently struggling with.
The future we envision however will be a hybrid of everything available today. Where one framework, which is defined as the easiest to adopt by developers and proposes a complete solution, uses complementary techniques such as web components, web assembly and AI, to create an end to end solution for developing applications.
The core parts of the application will be built using web components so that they are used and shared easily.
Web assembly will serve as speed boosts in parts of the application to make the application faster and better performant.
AI will serve to speed up the development process, whether to provide starting code reducing boilerplate, or used to validate the quality of the code produced.
Is a specific framework the answer? Or web components? Or possibly some kind of hybrid approach? Does the future lie in techniques and practices we adopt more than technology, such as using micro front ends where different teams are working with different stacks? Are organizational structures the answer to choices we make in technology?
Click Here
Content Is King
The exposition of your business or enterprise to a global community (the global village) via the internet is an attribute all and sundry will attest as being the main salient feature of the web. It has literally created a level playing field so to speak for thousands of small businesses or enterprises that hitherto had no way of exposing their services or products to such a world wide customer base. There is though some side effects to this seemingly technological brilliance. You have now got the exposure just like thousands of others but how do you differentiate yourself from others providing similar services? This is where the design of your website and in particular, the content displayed in the interface both graphic assets and contextual text respectively becomes prominent. All graphic assets used as part of the interface design, must accentuate the services or products you are selling.
All written text on your website pages must be simple, clear, explicit, un-convoluted and more importantly be in plain Simple English. One can not emphasis enough the importance of plain simple English. Bear in mind, this is the first interaction between you and a potential customer. Your written text as most people will attest, can so easily labelled your site as not being professional enough. Get it wrong on your home page through a simple typo or a poorly phrased sentence and you are unseemingly or unwittingly diverting potential traffic to your rivals. The internet is very unforgiving with this type of mishap. Rest assured people will make judgement from this experience and the consequence by and large, is not to return to your site. It can get worse - telling others about the poor grammar or aesthetic attribute of your site can propagate on the web like "wild desert fire" and you have every little means of quenching it. In other words, try not to devalue the products or services you provide by poor English grammar - first impression on the web last for eternity even if you are selling gold for pittance.
Always ask a professional copy writer to write all your text messages if you are not competent enough to do it. All sites designed by us by default have their text messages written by professional copy writers and integrated with metadata for optimised SEO results.
Bespoke Web Design
