As web application development evolved, usage of JavaScript skyrocketed. To address the variance in support of JavaScript, HTML across the different browser versions libraries like jQuery evolved to offer a layer of abstraction for the web developers, so that they can just focus on writing their application logic instead of worrying about the vagaries of browser support. Single-page web applications started to become the norm as more code started to be written in JavaScript than ever before. JavaScript has also become the language of choice to deliver applications that run on desktop browsers and mobile phones. So web applications written in JavaScript are now in the run-in environments with huge variations in parameters such as device CPU & memory, network bandwidth, browser support.
Powering this scale of growth needed the emergence of more JavaScript frameworks that provide abstractions over this diversity of hosting environments packaging up the best practices in loading times, memory usage, and responsiveness. There is simply no way to deliver a high-quality user experience without basing application development on top of these quickly evolving JavaScript frameworks such as Angular. Leave it to the smart folks in the Angular team to worry about keeping up with the evolving web application requirements while the application developers’ energies are productively engaged with solving the business problem at hand.
WaveMaker is the only Rapid application development platform with open-standards-based code generation using Angular & Spring. Our 110+ UI components are implemented as Angular components built into libraries. When the user starts building a page in WaveMaker, the product starts generating Angular code in the background. The generated code imports the UI components user dropped into the page and then wires them up using data binding.
The code generated by WaveMaker is fully customizable, allowing developers to write custom business logic in javascript. Using WaveMaker our customers have built a line of business apps, customer-facing portals, and mobile applications in several verticals such as insurance, banking, manufacturing, healthcare, retail, etc.
WaveMaker offers ready to use and well-tested component library and a visual development environment to drag-n-drop these components to design a page. WaveMaker abstracts away all the Angular concepts like routing, scoping, security (auth guards), i18n, and service integration with REST, SOAP & databases, etc. The developer focuses on building application capabilities like user interface & interaction, representing data with widgets like Forms, Table, Lists or Charts, etc., defining access control for both UI components and APIs.
WaveMaker UI components built using Angular are device responsive and designed to suit mobile-first apps. WaveMaker platform enables hybrid mobile application development, using device-native capabilities through Cordova combined with the power of responsive Angular widgets.
While WaveMaker has 110+ UI components and this list is ever-growing, we realize that teams may want to build reusable UI components to further decrease the time it takes to build applications in WaveMaker. WaveMaker supports importing reusable JavaScript components that are packaged as Angular.io elements, web components, or jQuery widgets. Using a WaveMaker feature called “prefabs” existing UI components can be imported and these will stay accessible alongside the standard WaveMaker UI components and can be easily dragged and dropped onto the page that is getting developed.
When users develop an app, WaveMaker generates application metadata that does not depend on a specific Angular version. From the metadata the Angular code is generated by the platform, keeping the app agnostic of any specific version of Angular. This means that the app will stay using the latest versions of Angular as WaveMaker rolls out the support for those versions. By simply upgrading WaveMaker versions the application will start reaping the benefits of staying on the latest version of Angular. There is no need to spend time in big stack upgrade projects that consume the productivity of your team.
One of the benefits of Angular is that the framework comes with tools that support very advanced build strategies that reduce your application’s footprint. This is very important to the application's load time as the amount of JavaScript that is getting downloaded from the cloud uses up critical resources such as network bandwidth, device CPU. Smaller the application footprint, the faster the app loads. When you attempt to deploy the WaveMaker app, we internally use ng build --prod mode with tree shaking enabled so that each page includes only the WaveMaker UI components that it uses and not all of the library. Essentially, the WaveMaker platform takes care of all the build optimizations and keeps the application footprint as optimal as possible to give better performance and first-time load experience.
WaveMaker builds which are triggered when the Deploy button is clicked can produce different bundles for frontend, backend code enabling the frontend code to be deployed on a CDN. Each of the resources the page depends on includes a fingerprint that represents the contents of the resource. This means that CDN that is serving static assets can be configured to set cache headers allowing browsers to cache the content and further optimizing the load times for returning users. Because of the content-based fingerprinting incremental releases of the WaveMaker application will only link to newer static assets if there was a change. In most cases, WaveMaker UI components for a page are already in the browser’s cache.
