Otreva https://www.otreva.com Web & Mobile App Development Company Wed, 19 Aug 2015 13:35:43 +0000 en-US hourly 1 Summer Marketing Internships https://www.otreva.com/employment/summer-marketing-internships/ https://www.otreva.com/employment/summer-marketing-internships/#comments Mon, 11 May 2015 16:20:08 +0000 https://www.otreva.com/?p=5112 ChannelApe is a SaaS e-commerce data automation platform with a focus on standardizing the way store owners manage a multitude of sales, order and fulfillment systems. E-commerce store owners are forced to sell on multiple sales channels like Amazon.com, eBay, and Shopify to be successful in today’s fast-paced, highly competitive market of e-commerce. To do […]

The post Summer Marketing Internships appeared first on Otreva.

]]>
ChannelApe is a SaaS e-commerce data automation platform with a focus on standardizing the way store owners manage a multitude of sales, order and fulfillment systems.

E-commerce store owners are forced to sell on multiple sales channels like Amazon.com, eBay, and Shopify to be successful in today’s fast-paced, highly competitive market of e-commerce. To do so means connecting inventory files, spreadsheets or APIs from many suppliers into a patchwork of manual processes just to ensure inventory levels are correct, cancellation rates are low and some profit is made. When combining that with different suppliers and fulfillment methods and store owners are spending all day managing their store rather than growing it.

ChannelApe helps suppliers automate and connect one or many inventory sources to their sales channels while helping them also have 1 streamlined way of processing and sending orders back to their suppliers and finally returning fulfillment information back to the end customer.

Position: 2 Part-time, Unpaid

Responsibilities

Interns will:

– Gain firsthand experience in assisting with product launches
– Gain knowledge in marketing innovation to help better reach and communicate with our customers, clients, and partnerships
– Help plan, create, execute and analyze marketing campaigns
– Work directly alongside the President as well as the Team Manager of the group
– Learn the day to day activities of how a growing firm operates inside a team-driven environment.

Intern responsibilities will include:

– Working on marketing campaigns
– A/B Testing
– Analytic Reporting
– Assistance with research and development of target markets
– Attend weekly marketing related meetings
– Providing assistance implementing and executing new campaigns and analytic reporting methods
– Working with external marketing and PR outlets and SAAS-based products
– Assistance with social media

 

 

Requirements

Our management team is currently seeking an intelligent, responsible, creative intern with high morals and values who demonstrates a positive personality, a thirst to learn and wants hands-on experience. We are looking for web-savvy and self-starting individuals who have a passion for marketing and SaaS (Service as a Software) products.

 

  • Accepted file types: docx, doc, pdf, indd, ai, eps, jpg.
    Have a resume or portfolio you want to upload? (docx, doc, pdf, indd, ai, eps, jpg only)

The post Summer Marketing Internships appeared first on Otreva.

]]>
https://www.otreva.com/employment/summer-marketing-internships/feed/ 0
How To Get Current Currently Checked Out Git Branch Without Feature https://www.otreva.com/blog/get-current-currently-checked-git-branch-without-feature/ https://www.otreva.com/blog/get-current-currently-checked-git-branch-without-feature/#comments Tue, 17 Feb 2015 14:10:09 +0000 https://www.otreva.com/?p=5065 Here at Otreva we are big fans of GIT and also the Gitflow workflow. We were recently creating an Atlassian Bamboo continuous integration plan on our OS X Mac builder which needed to know what currently checked out GIT branch was currently being built since we are using Bamboo’s automatic branching feature. We were then building […]

The post How To Get Current Currently Checked Out Git Branch Without Feature appeared first on Otreva.

]]>
Here at Otreva we are big fans of GIT and also the Gitflow workflow. We were recently creating an Atlassian Bamboo continuous integration plan on our OS X Mac builder which needed to know what currently checked out GIT branch was currently being built since we are using Bamboo’s automatic branching feature. We were then building the branch name direct to an AWS Elastic Beanstalk environment from the specific checkout out GIT branches so we needed their names to be less than 23 characters and have all “/” stripped due to AWS guidelines for environment naming.

The below command will allow you to get the currently checked out GIT branch as denoted with a * and also trim out and Gitflow branch naming before “/” like release/ or feature/ and also trip down to 22 characters.

branch=$(git branch|grep \*|sed 's/\*//'|sed 's/ //'|sed 's/\(.*\/\)//'|cut -c 1-12);

which you can then write to a file.

echo "branch = $branch" > "./bamboo.properties"

And it can be read with the Bamboo Inject Variables Plugin created by Atlassian Labs.

The post How To Get Current Currently Checked Out Git Branch Without Feature appeared first on Otreva.

]]>
https://www.otreva.com/blog/get-current-currently-checked-git-branch-without-feature/feed/ 0
Titanium: Problematic frame: C [libwebkitgtk-1.0.so.0+0x475dc9] webkit_web_view_get_type+0x2489 https://www.otreva.com/blog/titanium-problematic-frame-c-libwebkitgtk-1-0-00x475dc9-webkit_web_view_get_type0x2489/ https://www.otreva.com/blog/titanium-problematic-frame-c-libwebkitgtk-1-0-00x475dc9-webkit_web_view_get_type0x2489/#comments Fri, 26 Dec 2014 16:08:02 +0000 https://www.otreva.com/?p=5005 Is Titanium crashing when you try to load it on Ubuntu with an error similar to: # # JRE version: Java(TM) SE Runtime Environment (7.0_72-b14) (build 1.7.0_72-b14) # Java VM: Java HotSpot(TM) 64-Bit Server VM (24.72-b04 mixed mode linux-amd64 compressed oops) # Problematic frame: # C [libwebkitgtk-1.0.so.0+0x475dc9] webkit_web_view_get_type+0x2489 # The fix is simple, just disable […]

The post Titanium: Problematic frame: C [libwebkitgtk-1.0.so.0+0x475dc9] webkit_web_view_get_type+0x2489 appeared first on Otreva.

]]>
Is Titanium crashing when you try to load it on Ubuntu with an error similar to:

#
# JRE version: Java(TM) SE Runtime Environment (7.0_72-b14) (build 1.7.0_72-b14)
# Java VM: Java HotSpot(TM) 64-Bit Server VM (24.72-b04 mixed mode linux-amd64 compressed oops)
# Problematic frame:
# C  [libwebkitgtk-1.0.so.0+0x475dc9]  webkit_web_view_get_type+0x2489
#

The fix is simple, just disable the dashboard on startup.

Find TitaniumStudio.ini in your installation and add this to the bottom:

-Dtitanium.hideDashboard=true

The post Titanium: Problematic frame: C [libwebkitgtk-1.0.so.0+0x475dc9] webkit_web_view_get_type+0x2489 appeared first on Otreva.

]]>
https://www.otreva.com/blog/titanium-problematic-frame-c-libwebkitgtk-1-0-00x475dc9-webkit_web_view_get_type0x2489/feed/ 0
Titanium: [Android SDK Home] No Android SDKs were found under the specified SDK location https://www.otreva.com/blog/titanium-android-sdk-home-no-android-sdks-found-specified-sdk-location/ https://www.otreva.com/blog/titanium-android-sdk-home-no-android-sdks-found-specified-sdk-location/#comments Fri, 26 Dec 2014 15:57:03 +0000 https://www.otreva.com/?p=5000 Are you trying to get the Android SDK up and running with Titanium Studio on Ubuntu, but can’t seem to get Titanium to recognize it? After spending hours, I found the solution which is quite simple. The issue really stems from NodeJS. On Ubuntu, node is actually the Amateur Packet Radio Node program. NodeJS is the package we want. […]

The post Titanium: [Android SDK Home] No Android SDKs were found under the specified SDK location appeared first on Otreva.

]]>
Are you trying to get the Android SDK up and running with Titanium Studio on Ubuntu, but can’t seem to get Titanium to recognize it?

[Android SDK Home] No Android SDKs were found under the specified SDK location

After spending hours, I found the solution which is quite simple. The issue really stems from NodeJS. On Ubuntu, node is actually the Amateur Packet Radio Node program. NodeJS is the package we want. Unfortunately, Titanium doesn’t look for nodejs but node causing the issue. If you aren’t using Node and only need NodeJS, you can can easily symlink NodeJS to Node and the problem is fixed.

 

Open up a terminal and run:

sudo ln -s /usr/bin/nodejs /usr/bin/node

That is it! Of course this assumes you had all the dependencies like NodeJS already installed.

The post Titanium: [Android SDK Home] No Android SDKs were found under the specified SDK location appeared first on Otreva.

]]>
https://www.otreva.com/blog/titanium-android-sdk-home-no-android-sdks-found-specified-sdk-location/feed/ 1
Mobile Application Development with Cordova https://www.otreva.com/web-development/mobile-application-development-cordova/ https://www.otreva.com/web-development/mobile-application-development-cordova/#comments Tue, 04 Nov 2014 22:09:08 +0000 https://www.otreva.com/?p=4985 Developing mobile apps starts with a series of choices. Each choice plays an important role in the final look, function, and feel of an application. Choosing a specific platform may be the most crucial choice, as it will then determine what features are available and how an app can roll out. Cordova offers a variety […]

The post Mobile Application Development with Cordova appeared first on Otreva.

]]>
Developing mobile apps starts with a series of choices. Each choice plays an important role in the final look, function, and feel of an application. Choosing a specific platform may be the most crucial choice, as it will then determine what features are available and how an app can roll out. Cordova offers a variety of benefits to developers, allowing them to include a host of functions not available in all platforms.

What is Cordova?

Cordova is a series of application programming interfaces designed to allow access to all of a device’s hardware functions. For smartphones, this can encompass a range of different sensors, the camera, voice recognition, and much more. The native functions of the phone allow the integration of features like pedometers and real-world interaction.

As more businesses add beacon and sensor technology, the ability to use phone hardware to interact with that technology becomes a must. In addition to hardware, Cordova also allows app builders to work with social media. It’s not uncommon to see Facebook used as an authentication on websites or games, something made possible through the Cordova platform.

Cordova Makes Development Simple

Using the onboard hardware of a device is a major selling point for the platform. It allows developers to include things like barcode scanners, back-end analytics, geolocation, and many other functions, in one app. This all-in-one style of development helps keep costs low and returns high. After all, one of the biggest hurdles in app development is the challenge represented by designing for a variety of devices. Every app must work with Windows, Android, and iOS to get complete market penetration. Even within each market segment, developers face a variety of different screen sizes and interactive features. Not every phone has a fully functioning accelerometer. Cordova’s flexible platform allows developers to work on a single app that functions with a wide range of devices, cutting down on the need for device specific development.

How Cordova Works

Cordova uses a series of APIs that give developers access to native device hardware using Javascript. When it’s used in combination with an existing UI framework (Dojo Mobile, JQuery Mobile, etc.), this enables app development using absolutely zero native code. As an alternative, developers use Web-based tools and can design an app using only HTML, CSS, and JavaScript. Essentially, Cordova helps with native app building, without the use of native code. It helps take the challenge out of developing for multiple devices.

The post Mobile Application Development with Cordova appeared first on Otreva.

]]>
https://www.otreva.com/web-development/mobile-application-development-cordova/feed/ 0
Solutions to Common MySQL Problems https://www.otreva.com/web-development/solutions-common-mysql-problems/ https://www.otreva.com/web-development/solutions-common-mysql-problems/#comments Wed, 09 Jul 2014 13:06:21 +0000 http://www.otreva.com/?p=4553 MySQL is one of the most popular database engines, and with good reason. Once configured properly, it can help connect thousands of databases to servers and do so at relatively low cost. Plus, since it’s such a common tool, you’re unlikely to run into issues where servers don’t recognize it or you can’t get help […]

The post Solutions to Common MySQL Problems appeared first on Otreva.

]]>
MySQL is one of the most popular database engines, and with good reason. Once configured properly, it can help connect thousands of databases to servers and do so at relatively low cost. Plus, since it’s such a common tool, you’re unlikely to run into issues where servers don’t recognize it or you can’t get help configuring it to do what you want it to do. Sometimes, though, you will run into errors–especially configuration errors–that can be frustrating or confusing. If you’re having a hard time with MySQL, you may be running into one of these common problems.

 

Problem #1: High disk usage. Some MySQL users find that as they expand their operations, using MySQL for a large number of databases, it begins to take up too much disk space. Servers begin looking for data on different parts of the disk at the same time, which can slow or completely halt disk operation.

Solution: Configure MySQL to work mainly with memory, not disks. MySQL takes up far less memory than it does disk space, so the more you can get it to use your computers’ RAM instead of looking for data on disks, the more smoothly it will run. In particular, MySQL can be configured to use available RAM whenever possible and to put temporary tables in memory instead of on hard disks. If you have RAM available on your servers, this solution should speed things up. Just remember that the more databases you have, the more memory MySQL will need.

 

Problem #2: Losing connection to the server. If MySQL loses its connection to the server in the middle of data transfers, it will generate error messages instead of transferring the data as needed. This can be the result of a network problem, so your first step is always to check your network connections. If this problem occurs frequently, however, you may need to reconfigure MySQL.

Solution: Lost connections often happen because MySQL is configured to time out after only 30 seconds, which may not be enough time for large data transfers. Try configuring net_read_timeout to 60 seconds or longer. If you are timing out on initial connect, reconfigure connect_timeout to at least 10 seconds. This often happens if your connection is slow, so consider upgrading your network to connect faster as well.

 

Problem #3: Getting a “too many connections” error. As you expand your operations, you may need more computers to be able to connect to MySQL. If you don’t reconfigure MySQL, it will refuse some of these connections and generate a “too many connections” error message.

Solution: Reconfigure MySQL to accept more connections. To do this, change your max_connections variable. The default is 151; you can set it to whatever number accommodates the number of connections you need. You may also need to increase your open_files_limit to accommodate the number of connections open on your server at the same time.

The post Solutions to Common MySQL Problems appeared first on Otreva.

]]>
https://www.otreva.com/web-development/solutions-common-mysql-problems/feed/ 0
How Cloud Computing Can Even the Playing Field https://www.otreva.com/blog/cloud-computing-can-even-playing-field/ https://www.otreva.com/blog/cloud-computing-can-even-playing-field/#comments Mon, 30 Jun 2014 11:04:43 +0000 http://www.otreva.com/?p=4528 The cloud has been an IT buzzword for several years now, but it’s only now that businesses are beginning to see the real benefits of cloud computing. SMEs are set to be the greatest beneficiaries of a rapidly expanding tech sector that in itself is valued at almost $150 billion. Cloud computing reduces IT costs … […]

The post How Cloud Computing Can Even the Playing Field appeared first on Otreva.

]]>
The cloud has been an IT buzzword for several years now, but it’s only now that businesses are beginning to see the real benefits of cloud computing. SMEs are set to be the greatest beneficiaries of a rapidly expanding tech sector that in itself is valued at almost $150 billion.

Cloud computing reduces IT costs …

Cloud solutions are an IT manager’s dream come true, making it possible to do an awful lot more while spending an awful lot less. Cloud computing gives even the most modest small business access to the kind of processing and storage enjoyed by the biggest multinationals. Some common usages are starting to emerge in this sector such as:

  • Expanded e-commerce operations: Before The Cloud, small business were often punished for being too successful, simply because their e-commerce infrastructure couldn’t handle a sudden spike in traffic. Cloud computing makes that a thing of the past. Cloud services are not just massively scalable but are offered with intelligently elastic pricing structures.
  • Data Leveraging: Data is increasingly the most valuable asset of any business. IT departments in the past have focused on storage and processing of data, and intensive analysis had been seen as something of a luxury due to the additional processing overhead. Cloud computing makes this kind of deep analysis possible even for the most modest businesses without requiring huge investment
  • Collaboration: Many businesses are turning to cloud solutions to provide infrastructure for their staff. Even some large organizations have begun turning to Google Docs as a way of empowering staff to share and collaborate, while other more specific cloud services offer collaborative services in industries such as finance. It’s cheap, secure and allows staff to perform at their best.

… while making it easy to launch new services

Platforms such as Amazon Web Services offers a huge opportunity to small businesses who want to make a big impact. These platforms take software development to a whole new level: Think of them as huge sandboxes where you can build pretty much anything you can dream of.

Most platforms are language-agnostic, meaning that companies can use their existing in-house programming skills to build new applications and services. At this point in the past, there were huge entry barriers in the form of building an infrastructure to support these new applications. With AWS and others, it is possible to simply build and deploy, knowing that your app will be ready for business from day one.

The growth of the cloud has seen the return of the concept of an open Web, where all you need to succeed is a great idea. What will you build?

The post How Cloud Computing Can Even the Playing Field appeared first on Otreva.

]]>
https://www.otreva.com/blog/cloud-computing-can-even-playing-field/feed/ 0
Should I deploy on Amazon Web Services (AWS)? https://www.otreva.com/blog/deploy-amazon-web-services-aws/ https://www.otreva.com/blog/deploy-amazon-web-services-aws/#comments Thu, 26 Jun 2014 11:01:06 +0000 http://www.otreva.com/?p=4525 Yes, the cloud is offering major innovations in how business gets done and how platforms are maintained, but it’s not a zero-sum game. Out in the field, where we use these cloud models, we have to weigh the results of implementation and determine whether it makes sense for a particular project. Rapid Deployment and Elasticity […]

The post Should I deploy on Amazon Web Services (AWS)? appeared first on Otreva.

]]>
Yes, the cloud is offering major innovations in how business gets done and how platforms are maintained, but it’s not a zero-sum game. Out in the field, where we use these cloud models, we have to weigh the results of implementation and determine whether it makes sense for a particular project.

Rapid Deployment and Elasticity

One of the big benefits of using AWS is the speed at which you can make changes. Adding virtual machines or deploying major upgrades can be done essentially on the fly, at least in relation to the old way of doing things. You can also rely on contracts with a company that’s pretty well established in cloud computing and known for maintaining consistent results.

Fault Tolerance in Zones

Although it’s becoming the go-to tool for a lot of projects, like other systems, AWS is imperfect. For example, some administrators are pulling their hair out over the AWS availability zones.

When all zones are working perfectly, you don’t have a problem. But what if you encounter some serious downtime across one or more availability zones?

Experts recommend using fault tolerance the same way you would use a redundant array of independent disks for storage. Building systems into multiple AWS zones builds a stronger foundation, but it also takes more resources. And like other kinds of fault-tolerant redundant systems, the best strategies are not always clear-cut. How many irons do you need in the fire? And how to you maintain solvency?

This is one of the significant issues that we’re going to have to figure out around the cloud-computing world. Multi-tenancy creates efficiency of scale and outsourcing security can alleviate some major headaches for companies, but unless you can count on an uptime provision in a service level agreement, you’ll have to do the detective work on actual functionality on your own, which can sometimes be costly and sometimes turns into something that looks like a wild goose chase.

Nevertheless, AWS is a recommended platform for most of what companies have to do on a daily basis. It just requires some clear-eyed thinking about how to navigate this cloud platform in a way that has you covered when it looks like rain.

The post Should I deploy on Amazon Web Services (AWS)? appeared first on Otreva.

]]>
https://www.otreva.com/blog/deploy-amazon-web-services-aws/feed/ 1
UX & UI For Responsive Web Applications https://www.otreva.com/blog/ux-ui-responsive-web-applications/ https://www.otreva.com/blog/ux-ui-responsive-web-applications/#comments Mon, 23 Jun 2014 12:38:55 +0000 http://www.otreva.com/?p=4520 The User Experience (UX) and User Interface (UI) for web applications will vary greatly depending on the device used to access the site. For this reason, it’s important to begin with a responsive design. From there, you can customize the UX to match each device and select the UI that brings everything together. Responsive web […]

The post UX & UI For Responsive Web Applications appeared first on Otreva.

]]>
The User Experience (UX) and User Interface (UI) for web applications will vary greatly depending on the device used to access the site. For this reason, it’s important to begin with a responsive design. From there, you can customize the UX to match each device and select the UI that brings everything together.

Responsive web design

Take a moment to think back and recall the last 24 hours.

How many times did you flick your smartphone out of your pocket and look up a quick tidbit of information? This could have been the weather report, stock quotes, or simply a random bit of trivia you were discussing with a friend.

How many hours did you spend in front of a laptop or desktop computer browsing the web? Perhaps this was for work, or maybe it was just for pleasure.

Did you spend any time using a tablet computer during those 24 hours? If so, how long were you using that device and for what purpose?

Now that you have your last 24 hours of Internet activity in mind, consider the usage habits of the people you interacted with during that same period. How many of them were using their phones, tablets, and computer?

Each of these devices has a different operating system, different browser, different hardware, different screen size, and different Internet connection. However, it is expected that any website will should be able to load on any of these devices, and that is expected to happen quickly.

That’s the goal of responsive web design!

When configured properly, a website needs to quickly recognize the device being used to access the content hosted by the site. That content should be formatted and optimized for rapid and useful presentation on the device making the request.

For example, a website that looks great on a computer with a 22-inch monitor is impossible to use on a smartphone with a 4-inch touchscreen. The only way to keep people from bouncing right off the site is to reformat the content to fit within the dimension of the screen used to view it and the restrictions of the interface used to navigate the site.

Web application UX

When talking about the UX of a web application, this is in reference to the feel of the site.

  • Does the user enjoy the presentation?
  • Is the site easy to navigate?
  • What does the user do when they arrive at the site?
  • Where should the user go after they have consumed the information on the page they requested?

These are the questions a good user experience designer must address. More importantly, the UX will be different for each type of user, each device used to access the site, and each page on that site. This means you must create unique UX for smartphones, tablets, and desktop/laptop computers. Depending on your application, it may be a good idea to even design a unique UX for smart televisions and very large monitors.

Web application UI

Moving to the UI of a web application, we’re starting to consider the actual elements of the site.

  • Navigation buttons
  • Menu items
  • Font sizes
  • Content placement

All of these elements are included in the UI of a web application. Depending on the device being used to access the site, different methods of input are used. Interacting with a site using a keyboard and mouse is very different from using a touchscreen. Even within the realm of touchscreens, there is a big difference between using a 4-inch screen (like the one found on a smartphone) and a 10-inch screen (like the one found on a tablet). Each element of the UI for a web application must be selected to match with the device being used to access the site and the UX you’re trying to create.

The post UX & UI For Responsive Web Applications appeared first on Otreva.

]]>
https://www.otreva.com/blog/ux-ui-responsive-web-applications/feed/ 0
Responsive Web Design Performance tweaks for e-commerce and applications https://www.otreva.com/blog/responsive-web-design-performance-tweaks-e-commerce-applications/ https://www.otreva.com/blog/responsive-web-design-performance-tweaks-e-commerce-applications/#comments Mon, 16 Jun 2014 16:30:22 +0000 http://www.otreva.com/?p=4510 Responsive web design has come a long way in just a few short years since being introduced. It has allowed development shops like ours the ability to help out clients reach their end user regardless of what screen size the device they are using is. Responsive design takes an interesting approach to the problem mobile […]

The post Responsive Web Design Performance tweaks for e-commerce and applications appeared first on Otreva.

]]>
Responsive web design has come a long way in just a few short years since being introduced. It has allowed development shops like ours the ability to help out clients reach their end user regardless of what screen size the device they are using is. Responsive design takes an interesting approach to the problem mobile has caused for many sites in the past. Up until recently it was considered that having a desktop site codebase and a separate mobile site codebase was the way to handle this situation. While it still is the best approach for a few scenarios, the majority of of use cases can benefit from responsive design. However the biggest problem with responsive design is when it is created by the wrong hands. Many web developers have moved into the responsive space after being used to the fixed width sites of the past. However responsive design requires an entirely different mindset when prototyping sites and creating an amazing experience. While many have figured out how to make responsive work while changing the width of their browser window, fewer have understood the impact or performance on a real mobile device. While today’s smartphones are amazing, they still are slower in terms of hardware performance as well as mobile network performance. Things are getting better with each new phone released but we should always consider that performance plays a huge role in our end user’s experience. According to Internet Retailer, a 1-second delay in web site page load time translates into a 7% loss in conversions, according to research firm Aberdeen Group Inc. So if an e-commerce store owner makes $100,000 a day from its mobile site, a 1-second page delay could mean around $2.5 million in lost sales every year. Here are some of the tips and tricks we’ve learned over the last few years to ensure we have a great performing website regardless of which device or the speed of the user’s connection.

Mobile First

Mobile first has drawn a ton of attention over the last few years. It is the best method to take when designing responsive applications because it allows you to focus on the smallest screen and work your way up. Typically working the other way around yields “mobile” experiences that feel clunky and are hard to navigate as well as sometimes impossible to use on a mobile device. Using Foundation we’ll typically create our sites 100% in code first to get an idea of the prototype.

Media & Content Conditional Loading

We use Foundation’s interchange component to help us deal with the appropriate content for a variety of screen sizes. The number one error we see in other responsive sites is that many don’t take into account that users on mobile connections can’t support the same huge media that desktop users have taken for granted. Interchange allows us to easily handle that for a variety of screen sizes from smartphones on up. With just a small change to your HTML markup, you can conditionally load not only images of different sizes but any HTML content including something like Google Maps.

Reduce Bloat

While this may a bit more generic of a tweak, it is something I always like to keep in the back of my mind. A great user experience starts with giving the user exactly what they came for. While this may be obvious, I can’t tell you how many times I use sites that have all types of animated effects, color, and media yet have no clearly defined (of functioning) mobile navigation or it is hard to find given all the other features they’ve spent their time on. From when I start with a prototype up until final testing and even launch, this is a moto I like to kepe in the back of my mind. I’m not trying to avoid using new features and/or well placed animations, but just head over to themeforest and try some of those themes on a mobile phone and I think you’ll understand why reducing bloat is so important. Our goal is to try and keep sites under 500kb regardless of screen size and even smaller for devices that are likely to be using mobile broadband. I personally try to reduce size wherever possible.

Reduce Unnecessary DOM JavaScript – KISS

This is probably the worst type of bloat. While JavaScript is the programming language of the web and most all modern HTML pages are using it, overuse can negatively affect a user’s opinion of your site. I like to use the KISS ( Keep It Simple Stupid ) approach and minimize DOM access. DOM is one of the most complex APIs that slows down the code execution process. We’ve all experienced websites that overly manipulate the DOM. They are jumpy, slow, and feel buggy. Try to reduce it unless it provides a direct and measurable improvement to UX.

Use Grunt

We’ve recently converted all of our boring, annoying redundant tasks over to Grunt tasks. What and why use grunt? Automation. Every project we start begins with setting up a Gruntfile and specifically the compressed obfuscated JS and SASS / CSS components but we’ve found we can automate almost any redundant task at all. We’re even using grunt to run shell commands to do a variety of tasks for us every day. For those of you who have not heard of grunt, stop now and go check it out. Also check out the livereload feature of grunt-contrib-sass. With livereload you can connect multiple devices to your same development site and easily watch every device with each page refresh, scroll and update.

Minimizing HTTP Requests

Whether responsive or not, I think this is one of the most overlooked tweaks that has significantly reduced our total load times. By using Grunt coupled with grunt-contrib-concat you can move all your JavaScript into one file and all your CSS into one file. That single file will take longer to download but as a whole will reduce the overall load time of your page. Combining scripts into as few files as possible cuts down on RTTs and delays in downloading other resources. The same practice can be used for CSS as well as the use of CSS sprites. The overall fewer number of total requests, the better. Start using Google Chrome’s Developer tools and Network tab to begin diagnosing and cutting back. There are always exceptions so having only 1 JS or 1 CSS file may not be feasible but it is a great goal.

Compression

By using gzip or deflate you can reduce the number of bytes sent of the network. While the specifics to enabling compression on your site and server are undoubtedly different for each case, compression in general is one of the easiest ways to boost performance.

Use a CDN version of jQuery and other libraries

Definitely make use of Google’s hosted libraries for jQuery and other popular platforms. While this MAY goes against the above rule for minimizing HTTP requests, typically it will only help. When you use the Google hosted version of jQuery you are not only helping users on your site but other webmasters and users. Let’s say it is the first time a user visits your site in a newly installed browser or they just cleared their cache and cookies. If you have the hosted version setup, this means that yes, they will have to download the jQuery version from the Google Hosted library. But from then on, it’ll be cached for not only your site, but any other website using that same version. Chances are (for jQuery at least) a user already has a cache version when they come to your site.

I hope these tips, tweaks and best practices help some of you. Use the tools available to you and make sure you aren’t overlook the performance of your site.   Test your site at http://www.webpagetest.org today.

 

The post Responsive Web Design Performance tweaks for e-commerce and applications appeared first on Otreva.

]]>
https://www.otreva.com/blog/responsive-web-design-performance-tweaks-e-commerce-applications/feed/ 1