Don't make me think

As a front web developer, I could create UI faster or Optimize file to load page faster. But it hard to faster response time form server however 80-90% of the end-user response time is spent on the frontend. Nowadays we could use the Indexed Database API, or IndexedDB to reduce the request times. Less request times, less response time. What is IndexedDB ? IndexedDB is web browser standard interface for a local database of records holding simple values and hierarchical objects. IndexedDB was initially proposed by Oracle in 2009./* wiki */ What browsers would support IndexedDB ? Most browsers of hybrid devices support it exclude IE9-, Safari 7-,iOS Safari 7.1-, Opera Mini, Android Browser 4.3-./* caniuse.com */ When shall we use IndexedDB ? Save Money on web hosting Data index sort Data keyword search Keep data for period of time How to start it? //*************************************************************** //initDB //{Object}, {data: dbName, objectStore: storeName, ...

Morris is the public API which help you to create good looking bar/ area /line charts. The post refer to Morris API enhance bar chart feature that could set bar chart with axis without starting at 0. Please see the following link. If you would like to know how is going, search key word "isMultiData" in "morris.js" file. Enjoy it! example here: morris bar chart enhancement

IOS - Safari remote debugging works on OS X and IOS6 higher Enable web inspector on IOS device or simulator. Safari > Advance Web Inspector Enable developer mode in Safari Safari Preference > Advanced Tab > Check Show Developer Mode in Menu Bar. Connect IOS device to PC Open the APP you want to debug Go to developer mode and debug now.

I recently worked on a project to build a website with Bootstrap & jQuery. After that I used almost the same webpages to create a mobile app in iOS and Android with "Cordova". What is Cordova ? Cordova is a popular Apache Foundation open source project, providing a set of device APIs to allow mobile application developers to access native device functions—such as the camera or the accelerometer—from JavaScript. It allows you to use standard web technologies such as HTML5, CSS3, and JavaScript for cross-platform development, avoiding each mobile platforms' native development language. Getting start with Cordova The Command-Line Interface in Mac OS Setting up Download and install Node.js Download and install a git client Install Cordova Cli(on OS X and Linux) : $ sudo npm install -g cordova Create the App $ cordova create foldername com.example.hello AppName {AppName} is the same as the certificate name of App {foldername} is the same as the direct...

Twitter Bootstrap Carousel is a flexible and response way to add slider on your site. But It will fail to slide when you swipe it on mobile devices. How to make Bootstrap carousel could be run when swiping on mobile ? Here are 3 examples of adding swipe support to bootstraps carousel. JQM + Bootstrap 3 carousel Bootstrap 3 swipe support example - jQuery Mobile This is JQM:touch swipe + Bootstrap3:carousel. Swip in mobile and feel it. If speed up good, let me know. 2014 copyright @ Mei Lin TouchSwipe + Bootstrap 3 carousel Bootstrap 3 swipe support example -- TouchSwipe Plugin This is touchswipe + Bootstrap3:carousel. Swip in mobile and feel it. I...

In the past, if a different font was desired, I had to create images for the text instead.But image scale up badly and loaded slowly. I think web fonts is a better solution. Google Web Fonts(GWF) allow to host on their service for request fonts without limit. So It's easier to use different fonts in the web page. Most of all, I only use few characters but include one hole font family. Grunt-font-optimizer is the system which could help us to repack font with characters what we need. How to install Grunt-font-optimizer Install nodeJS Install grunt cli Install grunt-font-optimizer : npm install grunt-font-optimizer --save-dev Load grunt-font-optimizer in gruntfile.js grunt.loadNpmTasks('grunt-font-optimizer'); Download google web fonts form skyfonts Skyfonts is the system which could download and sync google fonts easily. Example to imprement grunt.initConfig({ font_optimizer: { default: { options: { // Chara...