campus party 2010

A apresentação comecará em alguns minutos ...

Wednesday, January 27, 2010

A apresentação comecará em alguns minutos ...

AkitaOnRails.com

~ 1 h> 100 slides

www.slideshare.net/akitaonrails

fabio.akita@locaweb.com.br

www.akitaonrails.com/!les/entendendo-a-web-movies.zip

Entendendo a WebLições sobre Desenvolvimento Web com Ruby

Fabio Akita

Pensamento Tradicional

Web Server

Browser

Web Server

Browser

Web Server

Browser

/site/default.asp

include header

/site/default.asp

include header

while ...

/site/default.asp

include header

while ...

Response.write

/site/default.asp

include header

include footer

while ...

Response.write

/site/default.asp

Ruby on Rails 2.3

Ruby 1.8

“Novo” Ruby 1.9Wednesday, January 27, 2010

Ruby on Rails 2.3

Ruby 1.8

Ruby on Rails 2.3

Ruby 1.8

x mais lento que C++

Python 2

Ruby 1.9

Python 3

Ruby 1.8.6

0 50 100 150 200

x mais lento que C++

Menos Requisições

DEVELOPMENT

PRODUCTION

Mini!que CSS e Javascript

Juicerhttp://github.com/cjohansen/juicer/

• git clone git://github.com/cjohansen/juicer.git

• cd juicer ; rake build

• gem install pkg/juicer-0.9.9.gem

• ./script/plugin install git://github.com/ktheory/juicer-rails.git

• juicer install yuicompressor

• juicer install jslint

<%= juiced_tag '/stylesheets/application.css' %> <%= yield(:head) %>

</head><body>

... <%= juiced_tag '/javascripts/application.js' %>

</body>

/app/views/layouts/application.html.erb

<%= juiced_tag '/stylesheets/application.css' %> <%= yield(:head) %>

</head><body>

... <%= juiced_tag '/javascripts/application.js' %>

</body>

@import url("reset.css");@import url("base.css");@import url("fonts.css");

/* @depends jquery-1.4.min.js @depends jquery.edit_in_place.js @depends jqueryamail.js*/

/public/stylesheets/application.css

/public/javascripts/application.js

@import url("reset.css");@import url("base.css");@import url("fonts.css");

/* @depends jquery-1.4.min.js @depends jquery.edit_in_place.js @depends jqueryamail.js*/

/public/stylesheets/application.css

/public/javascripts/application.js

• juicer merge public/stylesheets/application.css

• public/stylesheets/application.min.css

• juicer merge public/stylesheets/application.css

• public/stylesheets/application.min.css

• juicer merge -i public/javascripts/application.js

• public/javascripts/application.min.js

DEVELOPMENT

PRODUCTION

Asset HostsNavegadores abrem poucas conexões

simultâneas por domínio

def gallery gallery_path = File.join(Rails.root, "public/images/gallery/")

@images = Dir.glob(gallery_path + "*").map{ |f| f.gsub(gallery_path, "") }

/app/controllers/hello_controller.rb

/app/views/hello/gallery.html.erb

<% title "Gallery" %>

<% @images.each do |image| -%> <%= image_tag "gallery/#{image}" %>

<% end -%>

/app/views/hello/gallery.html.erb

<% title "Gallery" %>

<% @images.each do |image| -%> <%= image_tag "gallery/#{image}" %>

<% end -%>

DEVELOPMENT

/con!g/environments/production.rb

config.action_controller.asset_host = Proc.new do |source, request| protocol = if request.ssl?

request.headers["USER_AGENT"] =~ /(Safari)/ ? "http" : "https" else

"http" end

"#{protocol}://asset#{rand(6) + 1}.akitaonrails.local:3000"end

/con!g/environments/production.rb

config.action_controller.asset_host = Proc.new do |source, request| protocol = if request.ssl?

request.headers["USER_AGENT"] =~ /(Safari)/ ? "http" : "https" else

"http" end

"#{protocol}://asset#{rand(6) + 1}.akitaonrails.local:3000"end

### Host Database## localhost is used to configure the loopback interface# when the system is booting. Do not change this entry.##127.0.0.1 localhost255.255.255.255 broadcasthost::1 localhost fe80::1%lo0 localhost127.0.0.1 asset1.akitaonrails.local asset2.akitaonrails.local asset3.akitaonrails.local asset4.akitaonrails.local asset5.akitaonrails.local asset6.akitaonrails.local www.akitaonrails.local

/etc/hosts

PRODUCTION

Javascript embaixo!

<head> <title><%= h(yield(:title) || "Untitled") %></title> <%= stylesheet_link_tag 'application' %> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1.0.2/CFInstall.min.js" type="text/javascript"></script> <%= yield(:head) %></head><body>...

... <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1.0.2/CFInstall.min.js" type="text/javascript"></script> <script type="text/javascript"> // meu javascript customizado ... </script> </body></html>

• a2enmod de!ate

• editar /etc/apache2/mods-available/de!ate.conf

<IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript

AddOutputFilterByType DEFLATE application/x-httpd-php AddOutputFilterByType DEFLATE application/x-httpd-fastphp AddOutputFilterByType DEFLATE application/x-httpd-eruby

DeflateCompressionLevel 9

# Netscape 4.X has some problems BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems BrowserMatch ^Mozilla/4\.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine BrowserMatch \bMSIE !no-gzip !gzip-only-text/html</IfModule>

/etc/apache2/mods-available/de"ate.conf

Cabeçalhos de Expiração

• a2enmod expires

• editar /etc/apache2/mods-available/expires.conf

<IfModule mod_expires.c> ExpiresByType image/x-icon "access plus 1 year" ExpiresByType image/png "access plus 1 year" ExpiresByType image/jpg "access plus 1 year" ExpiresByType image/gif "access plus 1 year" ExpiresByType image/jpeg "access plus 1 year" ExpiresByType application/pdf "access plus 1 year" ExpiresByType audio/x-wav "access plus 1 year" ExpiresByType audio/mpeg "access plus 1 year" ExpiresByType video/mpeg "access plus 1 year" ExpiresByType video/mp4 "access plus 1 year" ExpiresByType video/quicktime "access plus 1 year" ExpiresByType video/x-ms-wmv "access plus 1 year" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType text/css "access plus 1 year" ExpiresByType text/javascript "access plus 1 year"</IfModule>

/etc/apache2/mods-available/expires.conf

Cache Busters

<%= stylesheet_link_tag 'application' %>

<%= javascript_include_tag 'application' %>

<%= image_tag "logo.png" %>

type="text/javascript"></script>

type="text/javascript"></script>

Use CDNs

Search

select * from ... where ... like “%...%”

or ... like “%...%”or ... like “%...%”or ... like “%...%”or ... like “%...%”

• Open Source Enterprise Search Platform

• Baseado no famoso Lucene

• Full Text Search, com relevância

• Indexa documentos (Word, PDF, etc)

• Interface REST

• Roda em containers de Servlet (Tomcat)

RackA API mais simples possível que

representa uma aplicação web genérica

ServerHTTP

ServerHTTPRequest

ServerHTTPRequest Response

lambda { |env| [200, {"Content-type" => "text/plain"}, "Hello World"] }

Requisição

Status

Requisição

Status Cabeçalhos

Requisição

Status Cabeçalhos Corpo

Requisição

RackRequest(env)

Response(Array)

RackRequest(env)

Response(Array)

.call(env)

RackRequest

Response

RackRequest

Response

RackRequest

Response

RackRequest

Response

RackRequest

Response

$ rake middleware

use ActionDispatch::Staticuse Rack::Lockuse Rack::Runtimeuse Rails::Rack::Loggeruse ActionDispatch::ShowExceptionsuse ActionDispatch::Callbacksuse ActionDispatch::Cookiesuse ActionDispatch::Session::CookieStoreuse ActionDispatch::Flashuse ActionDispatch::Cascadeuse ActionDispatch::ParamsParseruse Rack::MethodOverrideuse ActionDispatch::Headuse ActiveRecord::ConnectionAdapters::ConnectionManagementuse ActiveRecord::QueryCacherun Class

gem install rack

# run with 'rackup -p 9292 config.ru'require 'rubygems'

require 'rack'

app = Proc.new { |env| [200, {"Content-Type" => "text/html"}, "Hello Rack!"] }

run app

con!g.ru

rackup con!g.ru

Sinatrahttp://www.sinatrarb.com/

Otimizações Backend

Browser pede páginaSe existir no cache, retorna

Procura RotaChama ControllerExecuta AçãoComunica com Banco de Dados

Se existir no cache, pulaSe processar assíncrono, pula

Renderiza ViewRetorna resultado ao Browser

Apache2+ mod_proxy_balancer

Varnish

Memcached

MySQL Proxy

Assíncrono (ex. Resque, RabbitMQ)

LoadBalancer

App Server

LoadBalancer

App Server App Server

CacheCache

LoadBalancer

App Server

CacheCache

LoadBalancer

App Server

CacheCache

LoadBalancer

App Server

MySQLMaster

LoadBalancer

App Server

MySQLMaster

MySQLSlave

LoadBalancer

App Server

MySQL Proxy

MySQLMaster

MySQLSlave

LoadBalancer

App Server

MySQL Proxy

MySQLMaster

MySQLSlave

LoadBalancer

App Server

MySQL Proxy

MySQLMaster

MySQLSlave

Job Server

Tendências

C10K Problem

HTML 5

Web Sockets

Reactor/Deferrable Pattern

HTML 5

Web Sockets

HTML 5

Web Sockets

Browser

Browser Browser

Browser

conexões/eventos

Browser

conexões/eventos

Browser

processamento/eventos

Browser

conexões/eventos

Browser

conexões/eventos

Browser

conexões/eventos

Browser

conexões/eventos

Browser

conexões/eventos

Browser

conexões/eventos

Browser

BrowserBrowser

Browser

conexões/eventos

Browser

BrowserBrowser

Browser

conexões/eventos

Browser

BrowserBrowser

Aprendendo Mais

RAILS LABS

RAILSCASTS.com

Entenda os browsers

Entenda HTTP

Arquiteturas

Mundo Assíncrono

Mundo não Relacional

Entenda os browsers

Entenda HTTP

Arquiteturas

Mundo Assíncrono

Entenda os browsers

Entenda HTTP

Arquiteturas

Mundo Assíncrono

Entenda os browsers

Entenda HTTP

Arquiteturas

Mundo Assíncrono

Entenda os browsers

Entenda HTTP

Arquiteturas

Mundo Assíncrono

Thx!www.slideshare.net/akitaonrails

fabio.akita@locaweb.com.br

www.akitaonrails.com/!les/entendendo-a-web-movies.zip

campus party 2010

Technology

sistemas exploráveis - campus party

campus party 2010 - realidade aumentada, o que vem por aí

pitching overpower studios - campus party

campus party - computer vision

expresso nuvem-campus-party

palestra drupal - campus party 2014

palestra netbeans 6 campus party

campus party fiesp - 2013

mhealth at campus party 2014

apresentacão campus party 2010: relacao com investidores

pdf campus party 2010

campus party brasil 2010

alerta 199 campus party 2010

certificado de participação campus party

xna touch campus party

campus party brasil 2011_wikipedia_x

impressão 3d para campus party

campus party

campus party méxico 2011

apresentação thiago bordini campus party 2010