Game Changing Mobility

knowledge engineering blog

Month: June 2019

Performance Testing using JMeter

If you’ve ever done performance testing on a website, you know that there is not really an effective way to manually create enough load on that website.

Getting actual users to execute web application operations over and again is nearly impossible. For that, we need virtual users that can open multiple connections in parallel.

When bulk users attempt to access a website (say commercial websites) at the same time, there are high chances that the website suffers slowness and poor usability. Speed is one of the most important attributes of an application. A slow running application will lose many of its potential users.

Performance testing is done to ensure that the web application performs well under their expected workload.

Performance Testing using JMeter

In today’s competitive world, support for features and functionalities are not the only priority, the speed with which the website responds is also of great concern. The goal of performance testing is not to find bugs, but to eliminate the performance bottlenecks. A web application attributes like its response time, reliability, source usage and scalability do matter a lot. So, in order to test different aspects of a web application, we must test it in different ways. Different performance testing types are as follows:

Different Types of Performance Testing

Load

Load testing is performed to determine how a system behaves when multiple users access it simultaneously.

Stress

Stress Testing is done to ensure that the system would not crash in difficult situations.

Endurance

Endurance testing is done to evaluate how the system behaves when a significant load is applied over a long period of time.

Spike

In Spike testing, the web application is tested with extreme increments and decrements in the load.

Volume and scalability

Volume testing describes the ability of an application to handle additional user loads without affecting the performance. Scalability test is done to find the minimum and maximum loads at software, hardware and database levels. This gives the idea that the system is scalable after a load.

There are many robust testing tools available in the market that are capable to handle the various types of performance testing. Few of them have become the industry standard. The recent trend shows that most of the big players in the industry have taken tools like JMeter for all their performance testing needs.

jmeter

JMeter

Apache JMeter is a load testing tool that is based on Java. This open source software is used for testing the performance of most of the web-based applications. Performance is an inevitable factor for both mobile and web application as the user strength is very huge.

Advantages of JMeter

  • Open source and built in Java platform. It is highly extensible and platform independent.
  • User friendly- JMeter has got comprehensive GUI and it can easily create a test plan and configure the elements.
  • Support- Basically JMeter is designed for performance testing. But it can also be used for non-functional testing such as stress, distributed and web service testing by creating a test plan.

JMeter provides support for protocols such as FTP, SOAP, JDBC, HTTP

  • Documentation- Because of its robust documentation, user can have a clear idea on every step starting from the installation and configuration of test settings and generating the final report.
  • Recording- JMeter allows the user to record HTTP or HTTPS to create test plan using the recording facility. It uses a proxy server that allows JMeter to watch and record user actions while the user browses the web application with any normal browser. Once the recording is complete, we enter the number of threads, time and Start test. It is advisable to use the Non-GUI mode of JMeter if the user count is large.
  • Reporting- JMeter supports dashboard report generation. These reports help the user to understand test execution results.

Installation of JMeter

 Before installing JMeter, it is essential to check that Java is installed in the system. JMeter is a pure Java desktop application. It needs fully compliant JVM 6 or higher to perform its tasks. User can download and install the latest version of the Java SE Development Kit.

The latest version of JMeter available is JMeter 5.1

JMeter can be downloaded from the official website Apache.

From this website, user can download JMeter PGP or zip file under the Binaries section and then unzip the zip file into the directory where JMeter is to be installed. JMeter directory structure includes the following directories and files.

  • Bin: holds JMeter script file to start JMeter
  • Docs: holds JMeter documentation files
  • Extras: related extra files
  • Lib: holds the required Java library for JMeter
  • Lib/ext: includes core jar files for JMeter and its protocols

A test plan is stored in XML format.

Elements of JMeter

Thread Group

Thread group is the collection of threads. Each thread represents 1 user using the application under test. Basically, each thread simulates 1 real user request to the server.

elements of Jmeter

Samplers

Samplers indicate which type of request is sent to the server. It can be HTTP, FTP, JDBC requests.

Listeners

Listeners display the result of test execution. It can show the result in different formats such as tree, table, summary report, log files and graphs.

Configuration Elements

Config elements in JMeter are used to configure the sampler requests sent to the server. Commonly used config elements are CSV data set config, HTTP Cookie Manager, Login Config Element HTTP Request Defaults and FTP Request Defaults.

Assertions

It is used to validate the response of the request that the user sent to the server. Here user can verify the expected result with the actual result. If a user wants to check assertion of a sampler, then assertion must be added as child of that sampler. User can view Assertion result by adding Assertion Listener to the thread group.

Testing in non-GUI method

In non-GUI mode, JMeter can handle more requests per second. Increasing threads after a certain limit will result in JMeter crash in GUI mode. The following command is used to run the test plan in non-GUI mode.

jmeter -n -t <test JMX file> -l <test log file> -e -o <path to output folder>

Report Generation

A result log file can be generated in CSV or JTL format after running the load test.

Hope this article gave a real insight into the importance of performance testing in today’s web world and how modern testing tools like JMeter helps you to execute performance testing efficiently.

Happy Performance testing!

- Sneha Mohan

5 Trending React Native UI Components in 2019

Every software companies always tend to have an increasing interest in cross-platform applications since they have dramatically reduced the amount of resources required to build mobile apps.

React Native applications stands at the top when comes to cross-platform apps.

React native UI components

React Native has tremendous possibilities in designing the user interface of an application.

The main time-consuming process for building an app is its user interface. Many third-party libraries and UI toolkits are now available to help you build next level react native application.

Let’s see some possibilities of React Native UI designs.

1.NativeBase

NativeBase is the most popular and widely used library. It provides a wide range of cross-platform UI components for react native.

Nativebase is 100% open source.

One of our main goal with NativeBase 2.0 is to make it easy to theme the components with very little changes to the components themselves.

Nativebase are built with blocks called components. The Components are constructed in pure React Native platform along with some JavaScript functionality with a rich set of customizable properties. They are constructed in pure React Native platform along with some JavaScript functionality with a rich set of customizable properties. These components allow you to quickly build the perfect user interface.

Native base UI components

Building a button using normal react native code on left and with NativeBase on right

NativeBase includes components such as anatomy of your app screens, header, input, buttons, badges, icon, form, checkbox, radio-button, list, card, actionsheet, picker, segment, swipe-able list, tabs, toast, drawer, thumbnail, spinner, layout, search bar etc.

Each of these components in NativeBase is made with a better version of the same component in its native part.

After finding out about NativeBase we found ourselves using it in every app we develop.

For example, we used it in various screens in Referr app, a mobile application that helps users to win points and gift cards by recommending local businesses to their friends and family. Titles of every screen were made with NativeBase  { Header, Title }. This helped us in saving a lot of time and effort.

React native UI Referr app

We use NativeBase Header component in Referr to make a better feel in UI and to reduce time and effort.

 2. React Native Elements

 React Native Elements is another cross-platform react native UI toolkit. It is completely built in Javascript and is very much easy to use. React Native Elements also supports Expo. Every component in react native elements is customizable. You can change the basic colour, size, fonts etc. for each component.

React native elements component

With React Native Elements, coding becomes much simpler. If you want to create a button component, it is as easy as the below code.

 import { Button } from’react-native-elements’;

 <Button

     title=”Solid Button”

/>

React Native Elements also gives a wide collection of icons. It has all the social icons that a developer needs in the current scenario.

 3. React Native Material UI

 React Native Material UI provides highly customizable material design components for React Native. To make more customized components, React Native Material UI is using a single JS object the uiTheme. By default, it is a light theme that can be changed easily.

React native material UI

Installing React-native-vector-icons helps to unveil the full potential of React Native Material UI.  React-native-vector-icons has wide support for icons. It helps to easily change the primary colour of the application.

 4. UI Kitten

UI kitten react native UI component

React Native UI Kitten is a mobile framework with a set of easily customizable elements. Despite there are a lot of standalone react-native components nowadays, there are not so many frameworks that offer you a wide set of commonly used components as a single dependency with similar UI design.

For instance, in Web Development there are CSS frameworks like Bootstrap that allows you to add dozens of nice-looking elements. You can also style them according to your corporate guidelines by just changing variables.

UI Kitten framework attempts to fill this gap.

All components are flexible and can be customized. It aims at boosting your mobile application development and allows you to focus on business logic instead of view composition. It helps you to bring your MVP to life in a shorter period of time.

Using React Native UI Kitten you will be able to create style configurations of components that you use the most (buttons, inputs etc.). These styles can be reused then in the process of development. Configure them once and use anywhere!

For example, below code showcases how to build a button using UI kitten.

import{RkButton }from’react-native-ui-kitten’;

 render( ) {

  return(

    <View>

       <RkButton> Click me! </RkButton>

    </View>

  )

}

 5. Nachos UI

Nachos UI kit

 Nachos UI is a React Native component library. It has almost 30 customizable UI components. Nachos UI Kit is coded with Avocode which is a fully featured tool to share, hand-off and inspect Photoshop and Sketch designs.

Nachos UI also works on web with the help of React Native Web. It also has Prettier which is an opinionated JavaScript formatter. It also uses Jest Snapshot Testing. Nachos UI is so easy to use. For example, let’s look into an example of building a simple slider.

 import { Slider } from ‘nachos-ui’

 const Example = ({ value, handleOnChange })  =>  {

  return (

   <Slider

       value = { value }

       onValueChange = { handleOnChange }

   />

   )

 }

Conclusion

For every developer, his main aim is to build his application with impressive UI in a limited time frame. When I stepped into React Native, a most difficult milestone for me to pass was to build the user interface for an application. Because this took me a lot of time and effort to offer my client an effective solution with a mind-blowing interface. But now, with these predefined and customizable UI components, the styling of the user interface is made a lot easier. I suggest you should try at least one of these UI components in your next project.

Sharoon Shaji

 

What are the advantages of Kotlin over Java?

Kotlin vs java has been one of the hot topics of debate for the last few years.

Ever since Kotlin was released in February 2016 programmers have been having doubts about which language to use for Android development.

Kotlin vs Java

Java has been around for a very long time. It is being used by millions of programmers worldwide but had some minor drawbacks. Then Google introduces a new language specifically for android which is said to be better than Java.

Last year, Kotlin has been made a ‘first class’ language for Android development by Google in addition to existing support for Java and C++. The impact of Google’s decisions for adopting Kotlin can be seen from GitHub’s findings.

The number of GitHub notes and contributors using Kotlin for projects has more than doubled over the last couple of years.

I’ve been making android apps using Java for about 4 years now and, I learned Kotlin just three months ago. While making an app in Kotlin, I quickly understood that there are many advantages of using Kotlin over Java.

Advantages of Kotlin over Java

Readability

Comparing to Java, Kotlin has more readable and precise code which makes it easier to understand the program. After a small learning curve, a Java developer can easily understand how to write Kotlin very quickly.

After learning Kotlin I observed that it needed much less code than Java as shown below

Java

Java readability

Kotlin

Kotlin Readability

As we can see, Kotlin reduces boilerplate as compared to java. Now, boilerplate refers to those codes which must repeat lots and lots of times and which do not serve any purpose to the functionality of the application. Kotlin has been designed in a way that it eliminates the need for boilerplate code.

Kotlin requires fewer lines of code as compared to java.

In Java, we must create references for views using findViewById. In Kotlin, that is taken care of automatically, therefore, reducing the lines of code drastically. That makes it easier for a beginner to learn Kotlin.

Null-Safe

Null pointer exceptions also referred to as “The billion-dollar mistake”, is one of the most common errors that cause apps to crash if you are using Java.

Kotlin is null-safe by default. It does not allow variables to be assigned with a null value. But in Java, we can assign null values to variables and, it may lead to null pointer exception that may crash the application.

Using Getters and Setters

In Java, we have to use getter and setter functions for receiving data from variables in the modal classes. Model classes are just used for holding data. We can use the getters and setters for accessing the data from model classes.

Using getters and setters

In Kotlin we don’t need all those getter and setter functions. We can access all the data’s using the variable name itself. See the example below.

Kotlin getters and setters

This modal class in Kotlin only has to define the variables instead of also defining the getter and setter methods. While comparing the above two images, we can clearly see that Kotlin uses less code as compared to java.

Interoperability

Kotlin language is interoperable. This means that both Java and Kotlin are somewhat similar and we can use java commands and Java libraries in a Kotlin project.

Since Java is still being used by most programmers, Kotlin has been made to be interoperable. It can be used with existing Java classes and won’t cause any errors. The compiler will allow the code containing the Java and Kotlin classes to work flawlessly.

Because of this feature, developers can transition from Java to Android with ease.

Immutability

An immutable object is an object whose state cannot be changed once it is created.

In Kotlin variables are defined using val or var to help developers easily understand which values can be reassigned.

Using val in our code makes it super clean and will be able to safely assume that the properties will never be changed and that they will not be null. The benefit is that it allows you to just get on with the project at hand.

Conclusion

I can confidently say, Kotlin language is far better than Java for Android development as it takes care of the drawbacks Java has. Moreover, the transition from Java to Kotlin is easy and anyone who is interested in programming can make good progress within a short span of time.

- Benedict Thomas

Top 7 UI Trends in 2019

In today’s digital world, it is essential to create websites and mobile apps that enhance your brand identity, boost customer engagement and drives more traffic for your business. The customers expect a lot many things from brands and one of them is great user experience. We need to understand the customer’s preferences before we start designing our product.

The product should be user-friendly, easy-to-use and efficient. It should be neat and interactive. Your page design, logo design, navigation, and colour selection should be well researched and user engaging.

It’s important to leverage the UI designing trends that keep changing at frequent intervals. The competition bar has raised and mere updating your apps and websites bi-annually will not take you to a favourable position.

So, here are some latest trends for designing the UI that you can follow to remain ahead in the race.

Top 7 UI Trends in 2019

1: Gradients

We can see them everywhere; in illustrations, UI elements, and text. We love gradients because they add realism and depth to the platform, the way we see everything in real life. That probably explains why elements with gradients feel more natural.

Top 7 UI trends in 2019

The gradient designs also provide scope for performing creative colour experiments on the layout of the mobile apps, in an attempt to make them vibrant and eye-catching. Next year will probably bring us many more apps and websites with bold colours and gradients mixed with transparency.

2: Typography

Typography is one important factor that helps us to make the best UI. There is a trend of using big “headings” with gigantic fonts in combination with a little bit of smooth animation. Even if there is only a little content, it will catch the attention of eyes.

Today, UI designs for mobile apps seem to be incomplete without adding some bold typography as it is a key factor that contributes to holding the users’ attention. The typography trend works great with creative experiments that require a mix of elegant fonts with catchy taglines. Here are some examples of the same:

•       Text content that is visually integrated into creative images.

•       Addition of animated typographic elements.

•       Using interfaces based on typography as the core visual elements of a UI design.

3: Illustration and animated graphics

Illustrations are one of the most powerful tools in a designer’s toolbox. Well-crafted illustrations allow designers to convey pretty complex ideas without using too many words. So, when users see illustration, they can understand the concept in a glance.

An enjoyable illustration can give websites or mobile apps their own personality, thus making them more memorable.

Micro-animations help customers distinguish elements on the screens they are going to interact with. After an event takes place, feedback performs an important task in assuring the user that the intended action has actually happened.

This, in turn, brings users a better experience. Additionally, to make these pages stand out, these illustrations often come to life with complex motions.

4: AR

In 2019, web design trends will all involve thinking outside the box, or rather, the grid. We need to forget UI fixed to screens. Instead, we should emphasise interactions which feel like they take place within the real-world environment. Google and Apple have already introduced their own AR development platforms, ARCore and AEKit, that blend the physical and digital worlds.

Designers will need to go beyond screen-only interfaces to include physical interactions. Augmented Reality has ushered a new era in user interface design, a new way of thinking.

AR one of the top UI trends in 2019

5. Voice User Interface

The popularity of Alexa and Google Home can’t be undermined. They are the new norm, as they become users’ go-to medium to seek nifty information, get entertained and even control their routine tasks. The navigation-less, button-less and menu-less experience seems so intuitive to a user that 40% of adults now use voice search once per day!

This makes it clear — voice search is not the future. It’s already here and will only become more prevalent in 2019. Voice interactions are slowly but fundamentally changing the way we interact with interfaces.  Instead of relying on touchscreens, mice and keyboards, users are steadily accepting the hands-free way of doing their everyday tasks.

Smart home speakers have already found their place in the hospitality industry, automobiles and large enterprises. The convenience of having an always-on machine that helps you do your digital tasks will not only aid the visually impaired but also introduce a unique way for illiterate users to access the web, in years ahead.

6: Parallax Scrolling & Fixed Navigation Bar

Parallax scrolling is a website trend where the background content is moved at a different speed than the foreground content while scrolling. Parallax Design is a newer element which is being used by several designers in their designs. It involves creating a visual setting in which the object appears moving, or it appears different when viewed from different angles. This type of design is even possible with video and multi-layered parallax.

Fixed Navigation is helpful for users. When they scroll down a website, the navigation bar will be still visible to users and, it will help them to move to another webpage if they like to.

7: 3D graphics

The mass market currently has little demand for this technology and 3D graphics seems a bit unusual for websites. Nonetheless, 3D elements rendered specifically for a platform get a place in this year’s UI trend list.

It is added at the end of the list because, the production cost of 3D elements is not only higher, they take a longer time to load on a screen.

Nobody loves waiting. Users expect platforms to load in an instant. Any element that adds more time to the user journey meets with frustration.

The good news is, we don’t have to give up entirely on 3D elements. Faux-3D lets objects look three-dimensional. The downside is, they are not completely convincing regarding light and shadow.

The change in the design-first approach

The design-first approach for digital products became a primary attribute this year.

Why?

These designs should improve people’s lives and help businesses to meet their goals.

Most phones have lost their borders and have rounded edges, bezel-less displays or notch displays. That changes their interface quite a bit. It will pose challenges for designers to use sharp-edged elements in their mobile UI and app design.

In 2019, the trends prioritise speed, simple page designs with asymmetrical layouts, and most importantly, a mobile-first approach.

It is more likely that these trends will also change in the coming years as the main platform(mobiles) will be having major changes in layout and sizes.

- Vishnu Anilkumar