SlideShare a Scribd company logo
Web Program Performance Optimization




                        Email:designsor@gmail.com
                        Twitter:twitter/xiao_jue
Program Optimization ?

Program ?

Performance Optimization ?
data structure + algorithm (Worth)
What's Algorithm?

Simplify data structure.

Good design patterns may be not fastest.

Recommended for you

Using ngx_lua in upyun 2
Using ngx_lua in upyun 2Using ngx_lua in upyun 2
Using ngx_lua in upyun 2

This summary provides the key information from the document in 3 sentences: The document discusses using Lua and the ngx_lua module in UPYUN's CDN and API systems. It was built on top of Nginx with ngx_lua and contains over 40,000 lines of Lua code across many Lua modules. The system uses Lua for upstream health checking, load balancing, caching, and dynamic configuration of Nginx upstream servers.

openrestyconngx_luaupyun
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)

The document describes the process of opening a TCP connection between a client and MySQL database, including the initial handshake and response packets. It then explains how the MRTE-Collector works by using message queues to capture and parse MySQL packets from the source database, and replay them to the target database using multiple SQL player threads. The MRTE-Collector publishes messages to RabbitMQ queues which routes the messages to the proper queues subscribed by MRTE-Player.

mysqlmrtekakao
Developing High Performance Application with Aerospike & Go
Developing High Performance Application with Aerospike & GoDeveloping High Performance Application with Aerospike & Go
Developing High Performance Application with Aerospike & Go

In this presentation, Chris Stivers, introduces the audience to Aerospike and provides tips on improving performance of Application written in Go. Tips include how to use memory more effectively in Go, and using Aerospike for high throughput / low latency transactions.

performanceaerospikememory
One Billion loop Performance for language

time.c

time.py

time.js

time.php

Can you guess who the fastest?




           time.c 0.28s time.js 0.19s time.php 10s time.python 5.46599197388s
Where's web program different than common program?




            We need more and more things to do.
Fat client,thin client;
B/S or ERP;
Web site;
Web game;
More and more.

Back-end or Front-end
development and optimization.

Historical issues.
Browser - > server -> DB;
DB-> server -> Browser;

Read:
Browser->server->Cache->DB;
1,Cache->server->Browser;
2,DB->Cache->server->Browser;

Write:
Browser->server->Cache ;

Interval write:
Cache-> DB;

Recommended for you

Monitoring MySQL with OpenTSDB
Monitoring MySQL with OpenTSDBMonitoring MySQL with OpenTSDB
Monitoring MySQL with OpenTSDB

A monitoring system is arguably the most crucial system to have in place when administering and tweaking the performance of any database system. DBAs also find themselves with a variety of monitoring systems and plugins to use; ranging from small scripts in cron to complex data collection systems. In this talk, I’ll discuss how Box made a shift from the Cacti monitoring system and other various shell scripts to OpenTSDB and the changes made to our servers and daily interaction with monitoring to increase our agility in identifying and addressing changes in database behavior.

mysql opentsdb box boxhq monitor monitoring hbase
NoSQL and SQL Anti Patterns
NoSQL and SQL Anti PatternsNoSQL and SQL Anti Patterns
NoSQL and SQL Anti Patterns

This document provides examples of common SQL anti-patterns and related NoSQL alternatives. It discusses issues like using tables as trees, caches, queues, or logs. It also addresses dynamic schema/table creation, stored procedures, row padding, complex joins, and object-relational mismatches. The document recommends alternatives like document databases, key-value stores, message brokers, and denormalization. It includes examples of modeling book data in MongoDB and Redis.

mongodbnosqlmapreduce
Roll Your Own API Management Platform with nginx and Lua
Roll Your Own API Management Platform with nginx and LuaRoll Your Own API Management Platform with nginx and Lua
Roll Your Own API Management Platform with nginx and Lua

We recently replaced a proprietary API management solution with an in-house implementation built with nginx and Lua that let us get to a continuous delivery practice in a handful of months. Learn about our development process and the overall architecture that allowed us to write minimal amounts of code, enjoying native code performance while permitting interactive codeing, and how we leveraged other open source tools like Vagrant, Ansible, and OpenStack to build an automation-rich delivery pipeline. We will also take an in-depth look at our capacity management approach that differs from the rate limiting concept prevalent in the API community.

luaglueconapi
I/O

Network I/O

Disk I/O

Memory I/O
Nosql

Cassandra
Mongo
Memcached
Redis
Terracotta


Somethings else for back-end development
1,You type an URL into address bar in your preferred browser.

2,The browser parses the URL to find the protocol, host, port, and path.

3,It forms a HTTP request (that was most likely the protocol)

4,To reach the host, it first needs to translate the human readable host into an IP number,
and it does this by doing a DNS lookup on the host

5,Then a socket needs to be opened from the user’s computer to that IP number, on the port specified (most often port 80)

6,When a connection is open, the HTTP request is sent to the host

7,The host forwards the request to the server software (most often Apache) configured to listen on the specified port

8,The server inspects the request (most often only the path), and launches the server plugin needed to
handle the request (corresponding to the server language you use, PHP, Java, .NET, Python?)

9,The plugin gets access to the full request, and starts to prepare a HTTP response.

10,To construct the response a database is (most likely) accessed. A database search is made, based on parameters in the
path (or data) of the request

11,Data from the database, together with other information the plugin decides to add, is combined into a long string of text
(probably HTML).

12,The plugin combines that data with some meta data (in the form of HTTP headers), and sends the HTTP response back
to the browser.

13,The browser receives the response, and parses the HTML (which with 95% probability is broken) in the response

14,A DOM tree is built out of the broken HTML

15,New requests are made to the server for each new resource that is found in the HTML source (typically images, style
sheets, and JavaScript files). Go back to step 3 and repeat for each resource.

16,Stylesheets are parsed, and the rendering information in each gets attached to the matching node in the DOM tree

17,Javascript is parsed and executed, and DOM nodes are moved and style information is updated accordingly

18,The browser renders the page on the screen according to the DOM tree and the style information for each node

19,You see the page on the screen

20,You get annoyed the whole process was too slow.




https://github.com/chaosmical/HTTP-headers-status-CN/raw/master/http-headers-status-CN.jpg
Front-end-process
Resource downloads(cache and server handle)

CDN

DNS

Js Module downloads(Sync and Asyn)

Pack code

HTTP and browsers limit

Handle slowly users

Recommended for you

On Centralizing Logs
On Centralizing LogsOn Centralizing Logs
On Centralizing Logs

On Centralizing Logs with Syslog, LogStash, Elasticsearch, Kibana. Presentation from Radu Gheorghe from Sematext at Monitorama EU 2013.

sysloglogstashlogging
Node.js streaming csv downloads proxy
Node.js streaming csv downloads proxyNode.js streaming csv downloads proxy
Node.js streaming csv downloads proxy

Small Node.js proxy to turn a paginated JSON REST API into a CSV streaming download. Examples of code and patterns. Presented at the London Node User Group meetup, April 2014

javascriptservercode
Redis modules 101
Redis modules 101Redis modules 101
Redis modules 101

The document summarizes Redis Modules and provides an overview of how to build and use Redis Modules. Some key points: - Redis Modules allow developers to extend Redis with new commands by dynamically loading libraries written in C/C++. This provides new functionality and integrates with existing Redis data types and commands. - The Modules API provides both high-level and low-level interfaces. The high-level API is similar to Lua but slower, while the low-level API exposes specific Redis commands and data types for better performance. - Building a simple module involves writing a command handler, validating arguments, making Redis calls, and returning a reply. Modules are initialized via an OnLoad function and new commands can

cmodulesnosql
Resource downloads
Accept-Encoding:gzip
Cache-control,max-age,last-Modified, expires, eTag
Transfer-Encoding:keep-alive,Connection:chunked
CDN
CloudFlare

Speedy Mirror

Webluker

Public Resources on SAE

Taobao CDN
DNS
Js Module downloads(Sync and Asyn)
sync               function loadByQueue(list,type,callback){
                     Var _load={
                        “sync”:function(list){
>>                            Var src = list[0];
                              If(!src) callback();
 >>                            getScript(src,function(){
                                 list.shift();
  >>                              _load['sync'](list);
                               });
asyn                     },
                        “asyn”:function(list){
                            Var list = list.reverse(),len = list.length;
>>                           while(len—){
                               Var src = list[len];
>>                              queue[len] = flase;
                                 getScript(src,function(){
>>                                  queue.foreach(function(i){
                                     If(!i) return;
                                     If(i && i==queue.length){
                                        callback();
                                     }
                                    });
                                 });
                             }
                         }
                     }
                   }

                   LoadByQueue(['1.js','2.js','3.js'],”sync”);

Recommended for you

Building a High-Performance Distributed Task Queue on MongoDB
Building a High-Performance Distributed Task Queue on MongoDBBuilding a High-Performance Distributed Task Queue on MongoDB
Building a High-Performance Distributed Task Queue on MongoDB

This document discusses building a distributed job queue in MongoDB. It begins by outlining the requirements of processing tasks across multiple servers. It then describes the design of storing messages and tasks in MongoDB collections, including different message and task states. It also covers techniques like composite tasks, reducing polling through tailable cursors, and optimizing performance through retry logic and oplog replay. The overall aim is to build an asynchronous and scalable way to process jobs in a distributed manner using MongoDB.

Building Scalable, Distributed Job Queues with Redis and Redis::Client
Building Scalable, Distributed Job Queues with Redis and Redis::ClientBuilding Scalable, Distributed Job Queues with Redis and Redis::Client
Building Scalable, Distributed Job Queues with Redis and Redis::Client

This document discusses using Redis and the Redis::Client Perl module to build scalable distributed job queues. It provides an overview of Redis, describing it as a key-value store that is simple, fast, and open-source. It then covers the various Redis data types like strings, lists, hashes, sets and sorted sets. Examples are given of how to work with these types using Redis::Client. The document discusses using Redis lists to implement job queues, with jobs added via RPUSH and popped via BLPOP. Benchmark results show the Redis-based job queue approach significantly outperforms using a MySQL jobs table with polling. Some caveats are provided about the benchmarks.

moosejobqueueyapcna2012
Lua tech talk
Lua tech talkLua tech talk
Lua tech talk

The document discusses using Lua modules with Nginx. It provides an overview of Nginx and Lua, describing their key features and popular uses. It then covers how to integrate Lua into Nginx using the ngx_lua module, allowing Lua code to run at various phases of the Nginx request lifecycle. Specific techniques demonstrated include using Lua for shared memory caching, logging, issuing subrequests, and network communication via cosockets. Examples of practical applications like load balancing and analytics tagging are also presented.

luanginxlocaweb
Pack code
Css:No gzip
Js:More fastest execute,more smaller
Google Closure Compiler vs yuicompress
HTTP and browsers limit
Get fast than post

URLs over 2,000 characters will not work in the most popular web browser.

HTTP1.1 persistent connection

HTTP 1.1 HTTP 1.0 complicated the same domain

IE 6,7      2        4

IE 8        6        6

Firefox 2   2        8

Firefox 3   6        6

Safari 3, 4 4        4

Chrome 1,2           6   ?

Chrome 3 4           4

Opera 9.63,10.00alpha 4         4

One client 300 Cookie , One domain 20 Cookie

IE: css 31 stylesheet
Handle slowly users
var someapp = new app();

someapp.init();



var someapp = new app();

$.extend(someapp,{

Speed:null,

checkSpeed:function(){

var self = this,timeout = 10000;

self.Speed =
     setTimeout(function(){

$.trigger(“slowly”,[self]);

},timeout);

},

closeCheckSpeed:function(){

clearTimeout(this.Speed);
Front-end-execute
Dom Rendering

Css Rendering

Javascript Executed

Test and code refactoring

Some code skills

Recommended for you

Using Node.js to Build Great Streaming Services - HTML5 Dev Conf
Using Node.js to  Build Great  Streaming Services - HTML5 Dev ConfUsing Node.js to  Build Great  Streaming Services - HTML5 Dev Conf
Using Node.js to Build Great Streaming Services - HTML5 Dev Conf

The document discusses using Node.js to build streaming services. It describes how Node.js allows for scalable server-side code using JavaScript and mentions libraries like JSONStream that can be used to parse JSON streams. The document also discusses different types of streaming like simplex, throughput, and duplex streaming and how to manage backpressure in streams.

node.jsnodenodejs
MySQL Monitoring using Prometheus & Grafana
MySQL Monitoring using Prometheus & GrafanaMySQL Monitoring using Prometheus & Grafana
MySQL Monitoring using Prometheus & Grafana

This document describes how to set up monitoring for MySQL databases using Prometheus and Grafana. It includes instructions for installing and configuring Prometheus and Alertmanager on a monitoring server to scrape metrics from node_exporter and mysql_exporter. Ansible playbooks are provided to automatically install the exporters and configure Prometheus. Finally, steps are outlined for creating Grafana dashboards to visualize the metrics and monitor MySQL performance.

grafanaansiblemonitoring
From zero to hero - Easy log centralization with Logstash and Elasticsearch
From zero to hero - Easy log centralization with Logstash and ElasticsearchFrom zero to hero - Easy log centralization with Logstash and Elasticsearch
From zero to hero - Easy log centralization with Logstash and Elasticsearch

Presentation I gave during DevOps Days Warsaw 2014 about combining Elasticsearch, Logstash and Kibana together or use our Logsene solution instead of Elasticsearch.

kibanaelasticsearchspm
Dom Rendering
Css Rendering

1,Use efficient CSS selectors

2,Avoid CSS expressions

3,Put CSS in the document head

4,Specify a character set

5,Avoid reflow and repaint by specifying image
dimension

6,CSS3 Selectors

Speed vs Practicality
Javascript Execute

Order
Loading and Execution
Data Access and Cache(closures,scope)
DOM Scripting
Repaints and Reflows
Event Delegation
Algorithms and Flow Control
String and Regular Expressions(trim)
http://blog.stevenlevithan.com/archives/faster-trim-javascript

Responsive Interfaces
Ajax(MXHR,Data Format)
Test and code refactoring
refactoring based on Test
Write Testable code
Ui test and Unit test

Recommended for you

Top Node.js Metrics to Watch
Top Node.js Metrics to WatchTop Node.js Metrics to Watch
Top Node.js Metrics to Watch

This document discusses key metrics to monitor for Node.js applications, including event loop latency, garbage collection cycles and time, process memory usage, HTTP request and error rates, and correlating metrics across worker processes. It provides examples of metric thresholds and issues that could be detected, such as high garbage collection times indicating a problem or an event loop blocking issue leading to high latency.

monitoringdevopsperformance
Tuning Solr & Pipeline for Logs
Tuning Solr & Pipeline for LogsTuning Solr & Pipeline for Logs
Tuning Solr & Pipeline for Logs

An updated talk about how to use Solr for logs and other time-series data, like metrics and social media. In 2016, Solr, its ecosystem, and the operating systems it runs on have evolved quite a lot, so we can now show new techniques to scale and new knobs to tune. We'll start by looking at how to scale SolrCloud through a hybrid approach using a combination of time- and size-based indices, and also how to divide the cluster in tiers in order to handle the potentially spiky load in real-time. Then, we'll look at tuning individual nodes. We'll cover everything from commits, buffers, merge policies and doc values to OS settings like disk scheduler, SSD caching, and huge pages. Finally, we'll take a look at the pipeline of getting the logs to Solr and how to make it fast and reliable: where should buffers live, which protocols to use, where should the heavy processing be done (like parsing unstructured data), and which tools from the ecosystem can help.

solrsolrcloudtuning
nodejs_at_a_glance.ppt
nodejs_at_a_glance.pptnodejs_at_a_glance.ppt
nodejs_at_a_glance.ppt

This document provides an overview of Node.js and how to build web applications with it. It discusses asynchronous and synchronous reading and writing of files using the fs module. It also covers creating HTTP servers and clients to handle network requests, as well as using common Node modules like net, os, and path. The document demonstrates building a basic web server with Express to handle GET and POST requests, and routing requests to different handler functions based on the request path and method.

Some code skills
Avoid Double Evaluation
Use Object/Array Literals
Don't repeat work
Lazy/Conditional Advance Loading(code or assets)
Bitwise Operators
Native Methods
Front-end-scheme
Img optimization

Design

Seo

More choose for user

Tailor-made
Img optimization
JPG GIF PNG(8,24,32)
Pngcrush
Jpegtran
Gifsicle
Smush.it
Avoid AlphaImageLoader
Optimizing Sprites
Avoid Scaling Images
Design

Recommended for you

Node.js - async for the rest of us.
Node.js - async for the rest of us.Node.js - async for the rest of us.
Node.js - async for the rest of us.

Node.js is an asynchronous JavaScript runtime that allows for efficient handling of I/O operations. The presentation discusses developing with Node.js by using modules from NPM, debugging with node-inspector, common pitfalls like blocking loops, and best practices like avoiding large heaps and offloading intensive tasks. Key Node.js modules demonstrated include Express for web frameworks and Socket.io for real-time applications.

nodejsjavascriptnode.js
Play Framework: async I/O with Java and Scala
Play Framework: async I/O with Java and ScalaPlay Framework: async I/O with Java and Scala
Play Framework: async I/O with Java and Scala

This document discusses asynchronous I/O in Java and Scala using the Play Framework. It describes how LinkedIn uses a service-oriented architecture with hundreds of services making requests to each other. It then covers how Play supports non-blocking I/O using asynchronous code, promises, and futures to allow parallel requests without blocking threads. Key points covered include using map and flatMap to transform promises and futures, handling errors and timeouts, and the benefits of non-blocking I/O for scalability.

play frameworkjavalinkedin
Going crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHPGoing crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHP

The document discusses Node.js and compares it to other technologies like CakePHP. It provides an overview of Node.js including its event-driven and asynchronous model, key features like the V8 engine and packages/modules, and frameworks like Express. It then demonstrates building a sample messaging application with a JSON API using both CakePHP and Node.js.

cakephpnode.jsnode-js
Seo
Define keywords
In order of popularity
Removed Repeat keywords
Top three is title
Description meta tag
Keywords meta tag
h1-h6
Keywords appear tactics
Content for keywords(uri is title,tags cloud)
More choose for user
Slowly user
Special user
Disability user
Different terminal user
Tailor-made
User habits Analysis
Advance load assets
Front-end-tools
Page speed

Yslow

Chrom monster

DynaTrace

Recommended for you

About Node.js
About Node.jsAbout Node.js
About Node.js

Node.js is a JavaScript runtime built on Chrome's V8 engine that allows building scalable network applications using JavaScript on the server-side. It uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, suitable for data-intensive real-time applications that run across distributed devices. Common uses of Node.js include building web servers, file upload clients, ad servers, chat servers, and any real-time data applications. The document provides an introduction to Node.js concepts like callbacks, blocking vs non-blocking code, the event loop, streams, events, and modules.

node.jsnode js
Android and REST
Android and RESTAndroid and REST
Android and REST

This document discusses REST (REpresentational State Transfer) and how to implement RESTful services on Android. It begins by defining REST and describing its core concepts like client-server architecture, statelessness, uniform interface, and CRUD (create, read, update, delete) operations. It then covers how to make HTTP requests in Android using libraries like HttpURLConnection and Apache HTTP Client. Helpful libraries for working with REST APIs are also presented, including Gson for JSON parsing and CRest for declarative REST clients. The document emphasizes best practices like performing HTTP calls in a background thread, persisting data to content providers, and minimizing network usage.

restkrakdroidandroid
JS everywhere 2011
JS everywhere 2011JS everywhere 2011
JS everywhere 2011

The document discusses the future of server-side JavaScript. It covers various Node.js frameworks and libraries that support both synchronous and asynchronous programming styles. CommonJS aims to provide interoperability across platforms by implementing synchronous proposals using fibers. Examples demonstrate how CommonJS allows for synchronous-like code while maintaining asynchronous behavior under the hood. Benchmarks show it has comparable performance to Node.js. The author advocates for toolkits over frameworks and continuing development of common standards and packages.

web developmentjavascriptringojs
Endless possibilities
Meteor

Tower.js

Yes,they all based on nodejs !
Web program-peformance-optimization
Web program-peformance-optimization

More Related Content

What's hot

Tuning Solr for Logs
Tuning Solr for LogsTuning Solr for Logs
Tuning Solr for Logs
Sematext Group, Inc.
 
Lightweight DAS components in Perl
Lightweight DAS components in PerlLightweight DAS components in Perl
Lightweight DAS components in Perl
guestbab097
 
Storing 16 Bytes at Scale
Storing 16 Bytes at ScaleStoring 16 Bytes at Scale
Storing 16 Bytes at Scale
Fabian Reinartz
 
Using ngx_lua in upyun 2
Using ngx_lua in upyun 2Using ngx_lua in upyun 2
Using ngx_lua in upyun 2
OpenRestyCon
 
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
I Goo Lee
 
Developing High Performance Application with Aerospike & Go
Developing High Performance Application with Aerospike & GoDeveloping High Performance Application with Aerospike & Go
Developing High Performance Application with Aerospike & Go
Chris Stivers
 
Monitoring MySQL with OpenTSDB
Monitoring MySQL with OpenTSDBMonitoring MySQL with OpenTSDB
Monitoring MySQL with OpenTSDB
Geoffrey Anderson
 
NoSQL and SQL Anti Patterns
NoSQL and SQL Anti PatternsNoSQL and SQL Anti Patterns
NoSQL and SQL Anti Patterns
Gleicon Moraes
 
Roll Your Own API Management Platform with nginx and Lua
Roll Your Own API Management Platform with nginx and LuaRoll Your Own API Management Platform with nginx and Lua
Roll Your Own API Management Platform with nginx and Lua
Jon Moore
 
On Centralizing Logs
On Centralizing LogsOn Centralizing Logs
On Centralizing Logs
Sematext Group, Inc.
 
Node.js streaming csv downloads proxy
Node.js streaming csv downloads proxyNode.js streaming csv downloads proxy
Node.js streaming csv downloads proxy
Ismael Celis
 
Redis modules 101
Redis modules 101Redis modules 101
Redis modules 101
Dvir Volk
 
Building a High-Performance Distributed Task Queue on MongoDB
Building a High-Performance Distributed Task Queue on MongoDBBuilding a High-Performance Distributed Task Queue on MongoDB
Building a High-Performance Distributed Task Queue on MongoDB
MongoDB
 
Building Scalable, Distributed Job Queues with Redis and Redis::Client
Building Scalable, Distributed Job Queues with Redis and Redis::ClientBuilding Scalable, Distributed Job Queues with Redis and Redis::Client
Building Scalable, Distributed Job Queues with Redis and Redis::Client
Mike Friedman
 
Lua tech talk
Lua tech talkLua tech talk
Lua tech talk
Locaweb
 
Using Node.js to Build Great Streaming Services - HTML5 Dev Conf
Using Node.js to  Build Great  Streaming Services - HTML5 Dev ConfUsing Node.js to  Build Great  Streaming Services - HTML5 Dev Conf
Using Node.js to Build Great Streaming Services - HTML5 Dev Conf
Tom Croucher
 
MySQL Monitoring using Prometheus & Grafana
MySQL Monitoring using Prometheus & GrafanaMySQL Monitoring using Prometheus & Grafana
MySQL Monitoring using Prometheus & Grafana
YoungHeon (Roy) Kim
 
From zero to hero - Easy log centralization with Logstash and Elasticsearch
From zero to hero - Easy log centralization with Logstash and ElasticsearchFrom zero to hero - Easy log centralization with Logstash and Elasticsearch
From zero to hero - Easy log centralization with Logstash and Elasticsearch
Rafał Kuć
 
Top Node.js Metrics to Watch
Top Node.js Metrics to WatchTop Node.js Metrics to Watch
Top Node.js Metrics to Watch
Sematext Group, Inc.
 
Tuning Solr & Pipeline for Logs
Tuning Solr & Pipeline for LogsTuning Solr & Pipeline for Logs
Tuning Solr & Pipeline for Logs
Sematext Group, Inc.
 

What's hot (20)

Tuning Solr for Logs
Tuning Solr for LogsTuning Solr for Logs
Tuning Solr for Logs
 
Lightweight DAS components in Perl
Lightweight DAS components in PerlLightweight DAS components in Perl
Lightweight DAS components in Perl
 
Storing 16 Bytes at Scale
Storing 16 Bytes at ScaleStoring 16 Bytes at Scale
Storing 16 Bytes at Scale
 
Using ngx_lua in upyun 2
Using ngx_lua in upyun 2Using ngx_lua in upyun 2
Using ngx_lua in upyun 2
 
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
Intro KaKao MRTE (MySQL Realtime Traffic Emulator)
 
Developing High Performance Application with Aerospike & Go
Developing High Performance Application with Aerospike & GoDeveloping High Performance Application with Aerospike & Go
Developing High Performance Application with Aerospike & Go
 
Monitoring MySQL with OpenTSDB
Monitoring MySQL with OpenTSDBMonitoring MySQL with OpenTSDB
Monitoring MySQL with OpenTSDB
 
NoSQL and SQL Anti Patterns
NoSQL and SQL Anti PatternsNoSQL and SQL Anti Patterns
NoSQL and SQL Anti Patterns
 
Roll Your Own API Management Platform with nginx and Lua
Roll Your Own API Management Platform with nginx and LuaRoll Your Own API Management Platform with nginx and Lua
Roll Your Own API Management Platform with nginx and Lua
 
On Centralizing Logs
On Centralizing LogsOn Centralizing Logs
On Centralizing Logs
 
Node.js streaming csv downloads proxy
Node.js streaming csv downloads proxyNode.js streaming csv downloads proxy
Node.js streaming csv downloads proxy
 
Redis modules 101
Redis modules 101Redis modules 101
Redis modules 101
 
Building a High-Performance Distributed Task Queue on MongoDB
Building a High-Performance Distributed Task Queue on MongoDBBuilding a High-Performance Distributed Task Queue on MongoDB
Building a High-Performance Distributed Task Queue on MongoDB
 
Building Scalable, Distributed Job Queues with Redis and Redis::Client
Building Scalable, Distributed Job Queues with Redis and Redis::ClientBuilding Scalable, Distributed Job Queues with Redis and Redis::Client
Building Scalable, Distributed Job Queues with Redis and Redis::Client
 
Lua tech talk
Lua tech talkLua tech talk
Lua tech talk
 
Using Node.js to Build Great Streaming Services - HTML5 Dev Conf
Using Node.js to  Build Great  Streaming Services - HTML5 Dev ConfUsing Node.js to  Build Great  Streaming Services - HTML5 Dev Conf
Using Node.js to Build Great Streaming Services - HTML5 Dev Conf
 
MySQL Monitoring using Prometheus & Grafana
MySQL Monitoring using Prometheus & GrafanaMySQL Monitoring using Prometheus & Grafana
MySQL Monitoring using Prometheus & Grafana
 
From zero to hero - Easy log centralization with Logstash and Elasticsearch
From zero to hero - Easy log centralization with Logstash and ElasticsearchFrom zero to hero - Easy log centralization with Logstash and Elasticsearch
From zero to hero - Easy log centralization with Logstash and Elasticsearch
 
Top Node.js Metrics to Watch
Top Node.js Metrics to WatchTop Node.js Metrics to Watch
Top Node.js Metrics to Watch
 
Tuning Solr & Pipeline for Logs
Tuning Solr & Pipeline for LogsTuning Solr & Pipeline for Logs
Tuning Solr & Pipeline for Logs
 

Similar to Web program-peformance-optimization

nodejs_at_a_glance.ppt
nodejs_at_a_glance.pptnodejs_at_a_glance.ppt
nodejs_at_a_glance.ppt
WalaSidhom1
 
Node.js - async for the rest of us.
Node.js - async for the rest of us.Node.js - async for the rest of us.
Node.js - async for the rest of us.
Mike Brevoort
 
Play Framework: async I/O with Java and Scala
Play Framework: async I/O with Java and ScalaPlay Framework: async I/O with Java and Scala
Play Framework: async I/O with Java and Scala
Yevgeniy Brikman
 
Going crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHPGoing crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHP
Mariano Iglesias
 
About Node.js
About Node.jsAbout Node.js
About Node.js
Artemisa Yescas Engler
 
Android and REST
Android and RESTAndroid and REST
Android and REST
Roman Woźniak
 
JS everywhere 2011
JS everywhere 2011JS everywhere 2011
JS everywhere 2011
Oleg Podsechin
 
Using and scaling Rack and Rack-based middleware
Using and scaling Rack and Rack-based middlewareUsing and scaling Rack and Rack-based middleware
Using and scaling Rack and Rack-based middleware
Alona Mekhovova
 
Writing robust Node.js applications
Writing robust Node.js applicationsWriting robust Node.js applications
Writing robust Node.js applications
Tom Croucher
 
Implementing Comet using PHP
Implementing Comet using PHPImplementing Comet using PHP
Implementing Comet using PHP
King Foo
 
Introduction to Ajax programming
Introduction to Ajax programmingIntroduction to Ajax programming
Introduction to Ajax programming
Fulvio Corno
 
NodeJS
NodeJSNodeJS
NodeJS
Alok Guha
 
How and why i roll my own node.js framework
How and why i roll my own node.js frameworkHow and why i roll my own node.js framework
How and why i roll my own node.js framework
Ben Lin
 
Scaling python webapps from 0 to 50 million users - A top-down approach
Scaling python webapps from 0 to 50 million users - A top-down approachScaling python webapps from 0 to 50 million users - A top-down approach
Scaling python webapps from 0 to 50 million users - A top-down approach
Jinal Jhaveri
 
Choisir entre une API RPC, SOAP, REST, GraphQL? 
Et si le problème était ai...
Choisir entre une API  RPC, SOAP, REST, GraphQL?  
Et si le problème était ai...Choisir entre une API  RPC, SOAP, REST, GraphQL?  
Et si le problème était ai...
Choisir entre une API RPC, SOAP, REST, GraphQL? 
Et si le problème était ai...
François-Guillaume Ribreau
 
Rack
RackRack
Building and Scaling Node.js Applications
Building and Scaling Node.js ApplicationsBuilding and Scaling Node.js Applications
Building and Scaling Node.js Applications
Ohad Kravchick
 
Enhance Web Performance
Enhance Web PerformanceEnhance Web Performance
Enhance Web Performance
Adam Lu
 
Владимир Мигуро "Дао Node.js"
Владимир Мигуро "Дао Node.js"Владимир Мигуро "Дао Node.js"
Владимир Мигуро "Дао Node.js"
EPAM Systems
 
JRuby with Java Code in Data Processing World
JRuby with Java Code in Data Processing WorldJRuby with Java Code in Data Processing World
JRuby with Java Code in Data Processing World
SATOSHI TAGOMORI
 

Similar to Web program-peformance-optimization (20)

nodejs_at_a_glance.ppt
nodejs_at_a_glance.pptnodejs_at_a_glance.ppt
nodejs_at_a_glance.ppt
 
Node.js - async for the rest of us.
Node.js - async for the rest of us.Node.js - async for the rest of us.
Node.js - async for the rest of us.
 
Play Framework: async I/O with Java and Scala
Play Framework: async I/O with Java and ScalaPlay Framework: async I/O with Java and Scala
Play Framework: async I/O with Java and Scala
 
Going crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHPGoing crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHP
 
About Node.js
About Node.jsAbout Node.js
About Node.js
 
Android and REST
Android and RESTAndroid and REST
Android and REST
 
JS everywhere 2011
JS everywhere 2011JS everywhere 2011
JS everywhere 2011
 
Using and scaling Rack and Rack-based middleware
Using and scaling Rack and Rack-based middlewareUsing and scaling Rack and Rack-based middleware
Using and scaling Rack and Rack-based middleware
 
Writing robust Node.js applications
Writing robust Node.js applicationsWriting robust Node.js applications
Writing robust Node.js applications
 
Implementing Comet using PHP
Implementing Comet using PHPImplementing Comet using PHP
Implementing Comet using PHP
 
Introduction to Ajax programming
Introduction to Ajax programmingIntroduction to Ajax programming
Introduction to Ajax programming
 
NodeJS
NodeJSNodeJS
NodeJS
 
How and why i roll my own node.js framework
How and why i roll my own node.js frameworkHow and why i roll my own node.js framework
How and why i roll my own node.js framework
 
Scaling python webapps from 0 to 50 million users - A top-down approach
Scaling python webapps from 0 to 50 million users - A top-down approachScaling python webapps from 0 to 50 million users - A top-down approach
Scaling python webapps from 0 to 50 million users - A top-down approach
 
Choisir entre une API RPC, SOAP, REST, GraphQL? 
Et si le problème était ai...
Choisir entre une API  RPC, SOAP, REST, GraphQL?  
Et si le problème était ai...Choisir entre une API  RPC, SOAP, REST, GraphQL?  
Et si le problème était ai...
Choisir entre une API RPC, SOAP, REST, GraphQL? 
Et si le problème était ai...
 
Rack
RackRack
Rack
 
Building and Scaling Node.js Applications
Building and Scaling Node.js ApplicationsBuilding and Scaling Node.js Applications
Building and Scaling Node.js Applications
 
Enhance Web Performance
Enhance Web PerformanceEnhance Web Performance
Enhance Web Performance
 
Владимир Мигуро "Дао Node.js"
Владимир Мигуро "Дао Node.js"Владимир Мигуро "Дао Node.js"
Владимир Мигуро "Дао Node.js"
 
JRuby with Java Code in Data Processing World
JRuby with Java Code in Data Processing WorldJRuby with Java Code in Data Processing World
JRuby with Java Code in Data Processing World
 

More from xiaojueqq12345

前端模块化开发
前端模块化开发前端模块化开发
前端模块化开发
xiaojueqq12345
 
Fds-给前端用的服务器
Fds-给前端用的服务器Fds-给前端用的服务器
Fds-给前端用的服务器
xiaojueqq12345
 
Voluminous_Weibo
Voluminous_WeiboVoluminous_Weibo
Voluminous_Weibo
xiaojueqq12345
 
Lithe
LitheLithe
nodejs开发web站点
nodejs开发web站点nodejs开发web站点
nodejs开发web站点
xiaojueqq12345
 
Mxhr
MxhrMxhr
淘宝帮派活动项目总结
淘宝帮派活动项目总结淘宝帮派活动项目总结
淘宝帮派活动项目总结
xiaojueqq12345
 

More from xiaojueqq12345 (7)

前端模块化开发
前端模块化开发前端模块化开发
前端模块化开发
 
Fds-给前端用的服务器
Fds-给前端用的服务器Fds-给前端用的服务器
Fds-给前端用的服务器
 
Voluminous_Weibo
Voluminous_WeiboVoluminous_Weibo
Voluminous_Weibo
 
Lithe
LitheLithe
Lithe
 
nodejs开发web站点
nodejs开发web站点nodejs开发web站点
nodejs开发web站点
 
Mxhr
MxhrMxhr
Mxhr
 
淘宝帮派活动项目总结
淘宝帮派活动项目总结淘宝帮派活动项目总结
淘宝帮派活动项目总结
 

Recently uploaded

UiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs ConferenceUiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs Conference
UiPathCommunity
 
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses
Larry Smarr
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
Lidia A.
 
find out more about the role of autonomous vehicles in facing global challenges
find out more about the role of autonomous vehicles in facing global challengesfind out more about the role of autonomous vehicles in facing global challenges
find out more about the role of autonomous vehicles in facing global challenges
huseindihon
 
Quantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLMQuantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLM
Vijayananda Mohire
 
What's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptxWhat's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptx
Stephanie Beckett
 
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Chris Swan
 
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
Neo4j
 
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Bert Blevins
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
BookNet Canada
 
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides
Safe Software
 
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc
 
Implementations of Fused Deposition Modeling in real world
Implementations of Fused Deposition Modeling  in real worldImplementations of Fused Deposition Modeling  in real world
Implementations of Fused Deposition Modeling in real world
Emerging Tech
 
Comparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdfComparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdf
Andrey Yasko
 
Details of description part II: Describing images in practice - Tech Forum 2024
Details of description part II: Describing images in practice - Tech Forum 2024Details of description part II: Describing images in practice - Tech Forum 2024
Details of description part II: Describing images in practice - Tech Forum 2024
BookNet Canada
 
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Erasmo Purificato
 
20240705 QFM024 Irresponsible AI Reading List June 2024
20240705 QFM024 Irresponsible AI Reading List June 202420240705 QFM024 Irresponsible AI Reading List June 2024
20240705 QFM024 Irresponsible AI Reading List June 2024
Matthew Sinclair
 
How to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptxHow to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptx
Adam Dunkels
 
20240704 QFM023 Engineering Leadership Reading List June 2024
20240704 QFM023 Engineering Leadership Reading List June 202420240704 QFM023 Engineering Leadership Reading List June 2024
20240704 QFM023 Engineering Leadership Reading List June 2024
Matthew Sinclair
 
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - MydbopsScaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Mydbops
 

Recently uploaded (20)

UiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs ConferenceUiPath Community Day Kraków: Devs4Devs Conference
UiPath Community Day Kraków: Devs4Devs Conference
 
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
 
find out more about the role of autonomous vehicles in facing global challenges
find out more about the role of autonomous vehicles in facing global challengesfind out more about the role of autonomous vehicles in facing global challenges
find out more about the role of autonomous vehicles in facing global challenges
 
Quantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLMQuantum Communications Q&A with Gemini LLM
Quantum Communications Q&A with Gemini LLM
 
What's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptxWhat's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptx
 
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
 
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
 
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
 
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides
 
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
 
Implementations of Fused Deposition Modeling in real world
Implementations of Fused Deposition Modeling  in real worldImplementations of Fused Deposition Modeling  in real world
Implementations of Fused Deposition Modeling in real world
 
Comparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdfComparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdf
 
Details of description part II: Describing images in practice - Tech Forum 2024
Details of description part II: Describing images in practice - Tech Forum 2024Details of description part II: Describing images in practice - Tech Forum 2024
Details of description part II: Describing images in practice - Tech Forum 2024
 
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
 
20240705 QFM024 Irresponsible AI Reading List June 2024
20240705 QFM024 Irresponsible AI Reading List June 202420240705 QFM024 Irresponsible AI Reading List June 2024
20240705 QFM024 Irresponsible AI Reading List June 2024
 
How to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptxHow to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptx
 
20240704 QFM023 Engineering Leadership Reading List June 2024
20240704 QFM023 Engineering Leadership Reading List June 202420240704 QFM023 Engineering Leadership Reading List June 2024
20240704 QFM023 Engineering Leadership Reading List June 2024
 
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - MydbopsScaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
 

Web program-peformance-optimization

  • 1. Web Program Performance Optimization Email:designsor@gmail.com Twitter:twitter/xiao_jue
  • 2. Program Optimization ? Program ? Performance Optimization ?
  • 3. data structure + algorithm (Worth)
  • 4. What's Algorithm? Simplify data structure. Good design patterns may be not fastest.
  • 5. One Billion loop Performance for language time.c time.py time.js time.php Can you guess who the fastest? time.c 0.28s time.js 0.19s time.php 10s time.python 5.46599197388s
  • 6. Where's web program different than common program? We need more and more things to do.
  • 7. Fat client,thin client; B/S or ERP; Web site; Web game; More and more. Back-end or Front-end development and optimization. Historical issues.
  • 8. Browser - > server -> DB; DB-> server -> Browser; Read: Browser->server->Cache->DB; 1,Cache->server->Browser; 2,DB->Cache->server->Browser; Write: Browser->server->Cache ; Interval write: Cache-> DB;
  • 11. 1,You type an URL into address bar in your preferred browser. 2,The browser parses the URL to find the protocol, host, port, and path. 3,It forms a HTTP request (that was most likely the protocol) 4,To reach the host, it first needs to translate the human readable host into an IP number, and it does this by doing a DNS lookup on the host 5,Then a socket needs to be opened from the user’s computer to that IP number, on the port specified (most often port 80) 6,When a connection is open, the HTTP request is sent to the host 7,The host forwards the request to the server software (most often Apache) configured to listen on the specified port 8,The server inspects the request (most often only the path), and launches the server plugin needed to handle the request (corresponding to the server language you use, PHP, Java, .NET, Python?) 9,The plugin gets access to the full request, and starts to prepare a HTTP response. 10,To construct the response a database is (most likely) accessed. A database search is made, based on parameters in the path (or data) of the request 11,Data from the database, together with other information the plugin decides to add, is combined into a long string of text (probably HTML). 12,The plugin combines that data with some meta data (in the form of HTTP headers), and sends the HTTP response back to the browser. 13,The browser receives the response, and parses the HTML (which with 95% probability is broken) in the response 14,A DOM tree is built out of the broken HTML 15,New requests are made to the server for each new resource that is found in the HTML source (typically images, style sheets, and JavaScript files). Go back to step 3 and repeat for each resource. 16,Stylesheets are parsed, and the rendering information in each gets attached to the matching node in the DOM tree 17,Javascript is parsed and executed, and DOM nodes are moved and style information is updated accordingly 18,The browser renders the page on the screen according to the DOM tree and the style information for each node 19,You see the page on the screen 20,You get annoyed the whole process was too slow. https://github.com/chaosmical/HTTP-headers-status-CN/raw/master/http-headers-status-CN.jpg
  • 12. Front-end-process Resource downloads(cache and server handle) CDN DNS Js Module downloads(Sync and Asyn) Pack code HTTP and browsers limit Handle slowly users
  • 15. DNS
  • 16. Js Module downloads(Sync and Asyn) sync function loadByQueue(list,type,callback){ Var _load={ “sync”:function(list){ >> Var src = list[0]; If(!src) callback(); >> getScript(src,function(){ list.shift(); >> _load['sync'](list); }); asyn }, “asyn”:function(list){ Var list = list.reverse(),len = list.length; >> while(len—){ Var src = list[len]; >> queue[len] = flase; getScript(src,function(){ >> queue.foreach(function(i){ If(!i) return; If(i && i==queue.length){ callback(); } }); }); } } } } LoadByQueue(['1.js','2.js','3.js'],”sync”);
  • 17. Pack code Css:No gzip Js:More fastest execute,more smaller Google Closure Compiler vs yuicompress
  • 18. HTTP and browsers limit Get fast than post URLs over 2,000 characters will not work in the most popular web browser. HTTP1.1 persistent connection HTTP 1.1 HTTP 1.0 complicated the same domain IE 6,7 2 4 IE 8 6 6 Firefox 2 2 8 Firefox 3 6 6 Safari 3, 4 4 4 Chrome 1,2 6 ? Chrome 3 4 4 Opera 9.63,10.00alpha 4 4 One client 300 Cookie , One domain 20 Cookie IE: css 31 stylesheet
  • 19. Handle slowly users var someapp = new app(); someapp.init(); var someapp = new app(); $.extend(someapp,{ Speed:null, checkSpeed:function(){ var self = this,timeout = 10000; self.Speed = setTimeout(function(){ $.trigger(“slowly”,[self]); },timeout); }, closeCheckSpeed:function(){ clearTimeout(this.Speed);
  • 20. Front-end-execute Dom Rendering Css Rendering Javascript Executed Test and code refactoring Some code skills
  • 22. Css Rendering 1,Use efficient CSS selectors 2,Avoid CSS expressions 3,Put CSS in the document head 4,Specify a character set 5,Avoid reflow and repaint by specifying image dimension 6,CSS3 Selectors Speed vs Practicality
  • 23. Javascript Execute Order Loading and Execution Data Access and Cache(closures,scope) DOM Scripting Repaints and Reflows Event Delegation Algorithms and Flow Control String and Regular Expressions(trim) http://blog.stevenlevithan.com/archives/faster-trim-javascript Responsive Interfaces Ajax(MXHR,Data Format)
  • 24. Test and code refactoring refactoring based on Test Write Testable code Ui test and Unit test
  • 25. Some code skills Avoid Double Evaluation Use Object/Array Literals Don't repeat work Lazy/Conditional Advance Loading(code or assets) Bitwise Operators Native Methods
  • 27. Img optimization JPG GIF PNG(8,24,32) Pngcrush Jpegtran Gifsicle Smush.it Avoid AlphaImageLoader Optimizing Sprites Avoid Scaling Images
  • 29. Seo Define keywords In order of popularity Removed Repeat keywords Top three is title Description meta tag Keywords meta tag h1-h6 Keywords appear tactics Content for keywords(uri is title,tags cloud)
  • 30. More choose for user Slowly user Special user Disability user Different terminal user

Editor's Notes

  1. 程序( program )是为实现特定目标或解决特定问题而用计算机语言编写的命令序列的集合。为实现预期目的而进行操作的一系列语句和指令。一般分为系统程序和应用程序两大类。 一个程序应该包括以下两方面的内容。    1 对数据的描述。在程序中要指定数据的类型和数据的组织形式,即数据结构( data structure )。    2 对操作的描述。即操作步骤,也就是算法( algorithm )。 以上当然全部来自(百度百科)啦。 犀利的总结一下:数据结构 + 算法 = 程序(沃思)。 我这里想说的是 计算机语言,程序设计模式,不应该算在程序这个概念中,程序就定义而言,只是完成任务的工具集合或者操作指令等,看的是结果,所以语言和设计模式不算在程序的概念中,只是实现的过程。