Showing posts with label browsers. Show all posts
Showing posts with label browsers. Show all posts

Saturday, 26 July 2014

How to Increase Speed of Chrome on Android


With the release of Jelly Bean, Chrome became the default web browser on Android. The wildly successful desktop browser was now fully entrenched in the world’s largest mobile operating system.

Good Morning Everyone! I, Anubhav Sachan will explain you How to Speed Up Chrome on Android.
 
There are many great features that Chrome brought to Android web browsing—a double-tap-and-slide gesture to zoom in and out on web pages, its fantastic syncing feature which allows you to see tabs and bookmarks from all of your connected devices, and its hidden Chromecast support.  
One tradeoff, however, was that the browser felt a bit slower than its predecessor.  Today we’re here to stifle any complaints about Chrome and get it running at warp speed.


Let’s speed up Google Chrome on Android

Go to Chrome’s Hidden Settings Menu
From Chrome’s address bar, type chrome://flags and hit the enter key on your keyboard. This will take you to a hidden menu with a myriad of advanced settings.

Make the Following Adjustments
Below are six of the things I’ve been using to bring Chrome back up to lightning speed on my Nexus 5. Give them all a try and see if it doesn’t improve your browsing speeds.
  • Set “Maximum Tiles…” to 512
This tweak will increase the amount of RAM the browser is allowed to use, and should all but eliminate any stuttering when scrolling webpages. From the three-dot overflow menu at the top right, select Find in page. TypeMaximum Tiles to find the entry we’re looking for here. Tap the drop-down menu directly below this entry and set the value to 512.
  • Change the Number of Raster Threads
This setting will increase the rendering speed of images. From the search box up top again, type Number of Raster. On the first highlighted result, tap the drop-down menu and select 4.
  • Enable SPDY/4
This setting will make web transactions faster and decrease overall page load times. Type Enable SPDY in the search bar. Tap the link labeled Enable directly under the first highlighted result.
  • Enable Offline Cache Mode
This setting will allow Chrome to load cached versions of webpages when they cannot load for whatever reason. In the search bar again, type Enable Offline. Tap the Enable button just below the setting titled Enable Offline Cache Mode.
  • Enable Experimental Canvas Features
This final tweak will enable Chrome to utilize opaque canvas’ to increase load times and performance. Type Enable experimental canvas and tap Enable once again.
  • Enable Experimental Websocket Implementation
This feature is a new way to handle web traffic communication. After typing Enable Experimental Websocket into the search bar, tap the Enable link below the first result.


Relaunch Chrome
At this point, you’ll notice a box at the bottom of the page that says Your changes will take effect the next time you relaunch Google Chrome. Tap Relaunch Now, and the browser should disappear for a couple of seconds. When it comes back up, you’ll see the chrome://flags page with all of your changes already implemented.

You’re all set up now, so go ahead and close out the chrome://flags tab and commence with the lightning-fast browsing!


A Chrome App Helps You Stop Procrastinating
 
A Glimpse
A new extension for Google Chrome helps you stop procrastinate with a simple idea – it replace the new tab page of your browser with your incrementing age.
Most anti-procrastination apps on the web help you stay focussed and increase productivity by blocking time wasting websites. The thinking goes that if these online distractions are gone, you are more likely to focus on actual work.


Alex MacCaw has created Motivation, a Chrome app that takes a slightly different approach. It replaces the new tab page of your Google Chrome with a real-time counter that displays your incrementing age.
Every time you launch Chrome, or open a new tab in the browser, the extension works as a sobering reminder that the clock is ticking away. That may motivate you to exit the Bermuda productivity triangle and focus on the more important things.
The source code for the Motivation Chrome app is available on Github.

Friday, 2 May 2014

How to Test Website across Multiple Browsers and Devices Synchronously


Welcome back!  I, Anubhav Sachan, am here again with another guide “How to Test Website across Multiple Browsers and Devices Synchronously”.


Responsive Web Design (RWD) is now a common approach in building a mobile friendly website. But building a responsive website can be quite irritating when you have to test the website in multiple devices and screen-sizes.

Say you have three devices to run the test on, you may end up having to constantly refresh each browser in every of those devices, which is cumbersome, to say the least.

So the idea of “synchronized testing” has emerged to address this situation and make the workflow more streamlined. There is a Grunt plugin called Browser Sync  to perform this, and Iam going to show you how to deploy it in your project, in this post.


 Why use Browser Sync?
First off, I’m not saying that Browser Sync is the perfect tool. There are also a number of GUI Applications such as Adobe Edge Inspect and Ghostlab which are great tools as well. They both have a nice GUI, but here’s why I think Browser Sync is better than these Applications:

1) Browser Sync (as well as Grunt) is free which helps if you have little to no budget to work with.

2) It is open-source. Depending on your JavaScript and Node.js proficiency you can extend it to cater to your own specific requirements.

3) It is cross-platform. You can use it in Windows, OS X and Linux. Ghostlab, on the other hand, is only available in OS X and Windows.


Installation
 To start off, you would install the Grunt plugin called Browser Sync. I’m sure the name says it all; this plugin syncs a number of interactions that occur on the website including page scrolling, populating form fields, and clicking on links.

All these actions will be reflected in the other browsers and devices as they are happening. Type the following command to install Browser Sync in your working directory:


npm install grunt --save-dev
npm install grunt-browser-sync --save-dev



Configuration

Once installed, Browser Sync can be loaded within the Gruntfile.js, this way.





  module.exports = function(grunt) {  
     grunt.initConfig({  
         browser_sync: {  
             dev: {  
                 bsFiles: {  
                     src : 'navbar-fixed-top.css',  
                 },  
                 ghostMode: {  
                    clicks: true,  
                    scroll: true,  
                    links: true,  
                    forms: true,  
                 },  
             },  
         },  
     });  
     grunt.loadNpmTasks('grunt-browser-sync');  
 }; 



This configuration will monitor the navbar-fixed-top.css file and automatically refresh the browser when it’s changed. We should also enable ghostMode to keep track of interactions on the website.

Note: Browser Sync also provides a number of other configurations, you can check them out in detail on this page. For the time being, the above configuration should suffice for the project example in this article.

Once the configuration is set, go to Terminal (or Command Prompt) and run the task using the following command:

grunt browser_sync

After running the command, you will be prompted to add three line of scripts within the <head> tag.

Also, when you view your website in multiple browsers, it also records those browsers, and notifies you in Terminal. In this case, I opened the website in Chrome, Safari, and Mobile Safari (through iPhone Simulator).


Check It Out

Now, as you can see from the following animated GIF, all updates, changes, and interactions are synced in real time in all the browsers.

I would be happy to hear from you. You may send your Suggestions,Advices etc. on contac ifo at Developers page.
Thank You !