,
Abstract
Canvass is a powerful graphical web application for the viewing and analysis of voltage, current, and power data collected by PMI Boomerangs and Revolutions. Hosted at https://canvass.powermonitors.com, the application provides both a list and a map view of your field devices, along with tools for graphing data from these devices.
How Canvass Works
Canvass is what is known as a “web application”, which differs from a desktop or mobile application. A desktop or mobile application must be downloaded or copied to the local storage of a workstation or device, and then “installed.” Web applications differ from desktop and mobile applications in that they are never installed on the local workstation or device, but rather live in “The Cloud”, meaning that they are housed and maintained on a web server by the application’s author, and accessed via a “browser” over the Internet.
Canvass is a web application developed in-house by Power Monitors’ software team. Upon logging in, the web application downloads the application logic in the form of JavaScript files. JavaScript is a popular scripting language supported by all major web browsers today. The JavaScript code runs in a “sandboxed” runtime environment inside the browser itself. Whether viewing a list view of your devices, or zooming into a cluster of devices on the map, or graphing an RMS Voltage stripchart, JavaScript handles any user interaction, such as expanding a list, zooming a map, or clicking a button.
JavaScript listens for and converts these interactions into requests, which are sent to the Canvass web application server. The JavaScript awaits a server response, and upon receiving the response, presents the result to the user in the form of a device list, a zoomed-in map view (Figure 1), or a drawn graph on the screen (Figure 2).
Figure 1. Canvass Web Application (above)
Figure 2. Data graphed by JavaScript (below)
Browser Support
The “web browser” or simply “browser” is a piece of software installed on your workstation or device intended to render web pages according to certain specifications. There are a number of browsers available. The most popular are Google’s Chrome browser, Mozilla’s Firefox browser, Apple’s Safari browser, the Opera browser, and finally the most (in)famous browser, Microsoft’s Internet Explorer. All of the browsers listed above attempt to implement the specifications outlined by the W3C, with varying degrees of success.
Because browsers are developed and maintained by various interests, browsers are not strictly bound to the agreed-upon W3C specifications. Because of this, web application developers must choose which browsers to support. Many things factor into the decision of which browsers to support, but in the end it comes down to weighing a browser’s popularity and availability with a target demographic against feature requirements of the application, and of course security.
Canvass was commercially released in 2011, supporting Internet Explorer 7 and 8, Chrome, Firefox, and Safari, with unofficial support for Internet Explorer 6. Support for IE 6 was later dropped for security reasons. Canvass was not targeted to mobile browsers, however, there are some mobile-friendly features available in the application, such as touch navigation and zooming of graphs and the map view. Tested mobile browsers include Chrome for Android and Safari for iOS.
Performance
We’ve tested the most popular desktop browsers appearing in the Canvass application’s usage statistics, collecting data on both load/render times, and browser memory usage while using Canvass. The fastest load / render time on Windows was Chrome, followed by Opera. The fastest load / render time on OS X was Opera, followed by Chrome.
The “Load Times” graph (Figure 3) shows how long each of the tested browsers took from clicking the “Log In” button, to getting a fully rendered Canvass screen. Most modern browsers bundle developer tools natively which include a profiling tool for timing page load and render times. In the case of older versions of Internet Explorer, we used a third-party profiler plug-in called HttpWatch. HttpWatch is only supported back to IE version 8, which is why we have no load time data for IE version 7.
Figure 3. Load Times
The “Memory Usage” graph (Figure 4) shows how much system memory is used by each browser when only the Canvass application is opened and fully loaded. To measure memory usage of each browser, we used Task Manager in Windows, and Activity Monitor in OS X.
Figure 4. Memory usage
Security
Canvass transmits and receives all application code and user data over a secure connection. You can verify that Canvass (or any web page, or web application) is using a secure connection by looking for the “padlock” icon in the browser’s address bar. This indicates that the website is communicating view SSL (Secure Sockets Layer), as shown in Figure 5.
Figure 5. SSL being displayed in browser navigation bars
In addition to verifying that you are using an SSL connection, you should make sure your browser is updated to the latest version (See “Upgrade you Browser”). Some older browsers (for
Recommended Browsers
Internet Explorer held its own in our browser tests. If you use Internet Explorer, and intend to stick with it, we recommend upgrading to the latest version (see next section: Upgrading your Browser). Safari also fared pretty well, and continues to have good standards support.
Firefox was the slowest to load time of all of the tested browsers, and used the most system memory. However, it has excellent standards support, and overall Canvass performance, once loaded, is very good.
For the best overall experience, performance, and security, it is recommended that you use either Opera or Chrome, regardless of whether you are a Windows user or a Mac user.
Upgrade your Browser
Internet Explorer 10 didn’t fare so well in our tests, but versions 8 and 9 didn’t do too badly. The latest version, Internet Explorer 11 appears to be worse than version 8 and version 9. So why should you consider upgrading from IE 8 or 9 to IE 11?
There are two reasons that you should upgrade from your current version of Internet Explorer to the latest, version 11. The first reason is overall performance: While load times are marginally longer than IE 9, and memory usage slightly higher than IE 8, you are gaining the advantage of hardware acceleration, which will make Canvass and other graphical web pages and apps feel less “jumpy”, and give you faster in-app rendering. The second reason is security: Microsoft has announced that security updates will cease on January 12, 2016 for all of its browsers prior to version 113.
Modern browsers such as Chrome, Opera, Safari, and Firefox are known as “evergreen” browsers, meaning that they automatically upgrade themselves with new features and security fixes, without any interaction from you, the user. Internet Explorer currently requires manual upgrading via Windows Update, or the Microsoft website.
To determine which version of Internet Explorer you are currently using, follow these instructions provided on the Microsoft Help pages:
1. Open the desktop, and then tap or click the Internet Explorer icon on the taskbar.
2. Tap or click the Tools button Tools (or tap or click Help in the Menu bar), and then tap or click About Internet Explorer.
3. Select the Install new versions automatically check box, and then tap or click Close.
If you are using any version of Internet Explorer older than 11, and wish to continue using Internet Explorer, you should upgrade. Alternatively, we recommend installing Chrome, or Opera.
Conclusion
The best Canvass experience for Windows and Mac users is using the Chrome and Opera browsers, respectively. Other modern browsers work nearly as well, but regardless of which you choose, it is important for the best support and security to ensure that you are using the very latest version, especially for Internet Explorer.
References
1. A complete list of W3C members may be found here.
2. Microsoft Help article, “Which version of Internet Explorer am I using?”
3. Microsoft announces EOL for older Internet Explorer versions
Jason Pecor
Web Designer
jpecor@powermonitors.com
http://www.powermonitors.com
(800) 296-4120
