Download - Java script framework
Challenges in Front-end
Development
As per well-known lead front-end developer of Yahoo as well as author to many related technical books, Nicholas Zakas “Front end development is the most hostile development environment in the world."
Once a front end developer has finished doing their job, they get right back to work making sure that the product functions optimally on every browser, mobile device, and high-end toaster oven under the sun that makes Front end development much more complicated than it seems.
It’s also important to focus on the security of the product, protecting against CSRF, XSS, DNS pinning, and clickjacking.
Single Page Applications
The old-timers in Java might still remember the Swing & Applet
applications that formed the thick client web based UI. It was later to
be replaced with Jsp and many different template technologies that
offered thin client solutions. In last few years we are again moving
back to the fat client approach that we had started with.
In past few years, Single Page Applications (SPAs) have become
extremely popular on the web, because they are supposed to provide
a more fluid user experience entirely based on fat client approach.
Difference From Traditional Web
Application
In traditional web applications, the client (browser) initiates the communication with the server by requesting a page. The server then processes the request and sends the HTML of the page to the client. In subsequent interactions with the page –e.g. the user navigates to a link or submits a form with data– a new request is sent to the server, and the flow starts again: the server processes the request and sends a new page to the browser in response to the new action requested by the client.
In Single-Page Applications (SPAs) the entire page is loaded in the browser after the initial request, but subsequent interactions take place through Ajax requests. This means that the browser has to update only the portion of the page that has changed; there is no need to reload the entire page. The SPA approach reduces the time taken by the application to respond to user actions, resulting in a more fluid experience.
SPA Frameworks
The three major players in this area are AngularJS, EmberJS and Backbone.js
All the above mentioned frameworks have common features: their code is open, released under MIT license & they solve tasks of single-page web application creation with the help of MV* designing template. All of them have the concept of scene, event, data models & pathnames.
Backbone stands for minimalism. It is fast & simple in teaching & provides a minimal set of the necessary tools.
Angular is an innovator in extending HTML possibilities. It has a huge community & support from Google, it will have a constant growth & development. It suits well for fast and simple way to create a mockup as well as for huge projects.
EmberJS has the highest learning curve. Yet it would suit relatively bigger applications with long running client sessions. If you are creating heavy RESTful front-end apps, Ember is your framework.
Advantages Of AngularJS
AngularJS provides capability to create Single
Page Application in a very clean and maintainable
way.
AngularJS provides data binding capability to
HTML thus giving user a rich and responsive
experience
AngularJS is opensource & code is unit testable.
AngularJS uses dependency injection and make
use of separation of concerns.
AngularJS provides reusable components.
With AngularJS, developer write less code and
get more functionality.
Cases where Angular shines?
Building form-based "CRUD apps".
Throw-away projects (prototypes, small apps).
Slow corporate monoliths, when performance
does not matter and maintenance costs are not
discussed
Where Angular Fails
Teams with varying experience.
Projects, which are intended to grow.
Lack of highly experienced frontend lead
developer, who will look through the code all the
time.
Project with 5 star performance requirements.
Application written in AngularJS are not safe.
Server side authentication and authorization is
must to keep an application secure.
If your application user disables JavaScript then
user will just see the basic page and nothing
more.
Node JS
AngularJS is mostly but not necessarily used with
NodeJS.
It can also be used with Tomcat or any other
standard J2EE server.
Node.js is an open-source, cross-platform runtime
environment for developing server-side Web
applications.
Node.js is not a JavaScript framework, but its
applications are written in JavaScript and can be
run within the
Node.js runtime on a wide variety of platforms
that varies from Windows, IBM AIX, Linux or few
more.
NodeJS Single Thread Vs Java EE Multiple
Thread
Node.js provides an event-driven architecture and a non-blocking I/O API
designed to optimize an application's throughput and scalability for real-time
Web applications. The most important differences between NodeJS and
Java are the concurrency and I/O models. Java uses multi-threaded
synchronous I/O while NodeJS uses single threaded asynchronous I/O.
The below diagram shows how in a multithreaded environment, multiple
requests can be concurrently executed, while in a single-thread environment
multiple requests are sequentially executed. Of course, the multi-threaded
environment utilizes more resources.
It may seem obvious that a multithreaded environment will be able to handle
more requests per second than the single threaded environment. This is
generally true for requests that are compute intensive, which utilize the
allocated resources extensively.
Resource Usage However, in cases where requests involve a lot of I/O such as
database or web service calls, each request needs to wait for the
external engine to respond to the calls made, and hence the
allocated CPU and memory resources are not used during this
wait time.
The following diagrams illustrate this scenario where requests
involve I/O wait times:
Node.js is typically used where light-weight, real-time response
is needed, like communication apps and Web-based gaming. It
is used to build large, scalable network applications
Popular NodeJS Projects
GODADDY
GROUPON
IBM
MICROSOFT
NETFLIX
PAYPAL
RAKUTEN
SAP
VOXER
WALMART
YAHOO!
Is Node JS a replacement to Apache
Tomcat
This diagram shows the market position of the selected technologies
in terms of popularity and traffic compared to the most popular web
servers.
As per a report in https://dzone.com/articles/performance-
comparison-between that compares the performances of tomcat and
nodeJS, The Node.js is 20% faster than the Java EE solution for
the problem at hand.
Working with MEAN stack – The
Complete Solution The MEAN stack (MongoDB, Express.js, Angular.js,
Node.js) is now being deemed as the new LAMP (Linux, Apache, MySQL, PHP), the preferred technology stack for startups.
In the MEAN stack, the Linux operating system is replaced with any operating system that Node.js can run on. This includes MS Windows, Mac OS, and Linux. The Apache web server is replaced with the Node.js. The MySQL is replaced with MongoDB, which is a No-SQL database. The PHP server side programming language is replaced with the ExpressJS, which basically provides a thin layer of features over Node.js. Here is a key point; the ExpressJSand Node.js in combination are tools to run JavaScript on the server side.
MongoDB with its JSON document structure comes with a lot of flexibility and helps to create highly scalable solution and faster applications. MEAN stack is great for POC projects and for dealing with data that may ultimately prove tricky to constrain in table form.
Angular JS & SpringUsage of Angular JS consuming Spring REST based web services has
become very popular nowadays as it gives us the option to build a
complex, secure, high-traffic, enterprise level single-page application. In
fact many existing projects currently migrating their Spring MVC
application from JSP to Angular JS. We may use Spring Boot to quickly
build such an application with production-ready services, Basic health-
check and monitoring functions, Pre-configured, embedded Tomcat
server, Executable JAR packaging with all dependencies included, Very
little overall configuration overhead.
Why Unit Testing In Javascript? JavaScript is a dynamically typed language
comes with almost no help from the compiler. So JavaScript needs to come with a strong set of tests.
AngularJS is developed with unit testing in mind. With features like dependency injection testing components are much easier, because you can pass in a component's dependencies and stub or mock them as you wish.
For testing Angular applications there are certain tools that you should use that will make testing much easier to set up and run. We need to know the usage of Karma, Jasmine, angular-mocks.
Karma Karma is The official AngularJS team test runner.
We’ll use it to launch Chrome, Firefox, and PhantomJS.
It’s a JavaScript command line tool that can be used to spawn a web server which loads your application's source code and executes your tests. You can configure Karma to run against a number of browsers, which is useful for being confident that your application works on all browsers you need to support. Karma is executed on the command line and will display the results of your tests on the command line once they have run in the browser.
Karma is a NodeJS application, and should be installed through npm. Full installation instructions are available on the Karma website.
Jasmine
Jasmine is a behavior driven development
framework for JavaScript that has become the
most popular choice for testing Angular
applications. Jasmine provides functions to help
with structuring your tests and also making
assertions. As your tests grow, keeping them well
structured and documented is vital, and Jasmine
helps achieve this.
angular-mocks
Angular also provides the ngMock module, which
provides injecting & mocking for your tests. This
is used to inject and mock Angular services within
unit tests. In addition, it is able to extend other
modules so they are synchronous. Having tests
synchronous keeps them much cleaner and
easier to work with. One of the most useful parts
of ngMock is $httpBackend, which lets us mock
XHR requests in tests, and return sample data
instead.
Mocha
Mocha is a feature-rich JavaScript test framework
running on Node.js and in the browser, making
asynchronous testing simple and fun. Mocha tests run
serially, allowing for flexible and accurate reporting,
while mapping uncaught exceptions to the correct test
cases.
Mocha is free and open source, licensed under the
MIT license.
Why Integration Testing In
Javascript? As applications grow in size and complexity, unit as
well as manual testing would not be enough.
Integration testing is to test between components which can't be captured in a unit test. End-to-end tests are made to find these problems.
In large projects where we have hundreds of developers working in different teams a practice of running all integration tests should be mandatory before merging the code to master repository. It enables all developers to minimize the risks of their code & features overwritten by someone else’s by mistake.
Automation testing of such end-to-end scenarios would ensure integrity of all modules in all environments.
Summary
In the times of rapid app development, we need better ways to quickly
develop interactive web applications and that is where JavaScript
frameworks come to the rescue.
While learning Tech stack of Angular JS Architects and senior developers
must note that we have to wisely select a group of technologies, be it Node
JS or Spring MVC, that fits into our requirements and address all the non-
functional requirement of the application.
Comparing NodeJS with Spring would be like comparing Apples with
Oranges. Node.js is a platform while spring is a enterprise framework and
both have totally different usecases.
Node JS is better than Spring in creating Web services written on top of
NoSQL and RDBMS databases. The whole non-blocking model makes Node
JS a lot more faster than Web services implemented on top of Spring and
hosted on J2EE servers. Java + whole J2EE stack + Spring stack adds a lot
of overhead, and if you goal is to serve REST calls, Node JS gets the job
done, and gets it done well.
Spring is better at creating enterprise Java applications. It integrates into the
Java ecosystem a lot better than Node JS. If you have a lot of COTS
applications in your ecosystem, a Spring based web application will integrate
much easily.
References NodeJS - https://en.wikipedia.org/wiki/Node.js
MEAN stack - http://www.newspindigital.com/wp-content/uploads/2014/08/NSD_Node.js-Stack-1024x534.png
Market Position NodeJS Vs Tomcat -http://w3techs.com/technologies/comparison/ws-nodejs,ws-tomcat
What Developers Mean When They Build a MEAN Stack - https://www.newspindigital.com/nsd-tech-primer-the-mean-stack-a-k-a-full-stack-javascript/
Java EE threads v/s Node.js – which is better for concurrent data processing operations -http://bijoor.me/2013/06/09/java-ee-threads-vs-node-js-which-is-better-for-concurrent-data-processing-operations/
Unit Testing - https://docs.angularjs.org/guide/unit-testing