About order form improvements

4,654 views
4,603 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
4,654
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

About order form improvements

  1. 1. About Order Form Page Improvements Toshiaki Takahashi (06/09/2013)
  2. 2. Index ● About me ● About Order Form pages ● Architecture ○ decanter (Python) ○ chaplin.js (JavaScript) ○ express (node.js) ● Efforts for speed up ○ use socket.io to return API ○ cache in Redis to return API ○ use grunt.js for development efficiency
  3. 3. About me Toshiaki Takahashi @toshipon I work for Gengo as a front-end engineer since April 2013 I’m interested in.. CoffeeScript Go lang Rubymotion
  4. 4. Also I really like Steve Ballmer. please watch this movie! http://youtu.be/wvsboPUjrGc
  5. 5. About Order Form Page
  6. 6. About Order form page ● All replaced current pages (from PHP to Python) ● using decanter framework ● using Gengo API ● DEMO contributers
  7. 7. Using Libraries ● Back-end ○ decanter (python web app framework) ○ express (node.js) for use socket.io ○ RabbitMQ (connect from python to node.js has redundancy) ○ Redis (cache session) ○ Gengo API (gengo-python client libray) ● Front-end ○ chaplin.js (javascript mvc framework) ○ handlebars (template engine) ○ compass (build sass files) ○ RequireJS (optimize js files) ○ grunt.js (for builder)
  8. 8. decanter ● decanter is a python-base micro web framework ● Extended the bottle framework ● Feature ○ Simple and Small ○ Has directory structure ○ jsonvalidator (use jsonschema) ○ Session management using Redis ● http://gengo.github.io/decanter/ please fork it!
  9. 9. chaplin.js ● JavaScript MVC framework for single-page web app. ● http://chaplinjs.org/ ● Extended backbone.js ● Features ○ written in CoffeeScript (very readable code!) ○ memory managements ■ can dispose js events automatically. ■ backbone.js have to dispose events manually. ● chaplin.js can use Brunch as builder quickly.
  10. 10. Efforts for speed up
  11. 11. use socket.io for API returns ● this time, i wanted to achieve a multi-file upload. ● but, word counting of files by gengo API takes time. ● There is a simultaneous connection limit browser... ● so we change to return in the websocket to asynchronously return of the API.
  12. 12. use socket.io for API returns decanter RabbitMQ node.js Redis session management push by websocket/http http async
  13. 13. cache in Redis ● Increasing http requests is evil ● so some API request datas cache in Redis at first, and put to HTML as json. ● on front-end, parase json datas and cache js models at first.
  14. 14. use grunt.js ● using libraries mainly ○ grunt-contrib-coffee ○ grunt-contrib-compass (build SASS files and make sprite images) ○ grunt-requirejs ● environment ○ development ■ compile coffeescript/sass files ○ production ■ compile coffeescript/sass files ■ optimize by RequireJS (grunt-requirejs) ■ compress by uglify (grunt-contrib-uglify)

×