Personal tools

Skip to content. | Skip to navigation

Sections

Blog

You are here: Home Blog

Blog

Discutindo a relação com Varnish 3 e Plone 4

Posted by Cleber J Santos at 17/09/2012 09:15

Pois é, já é a segunda vez que dou palestra e posto aqui falando sobre o tema, dessa vez pude palestrar no Plone Symposium, o encontro da comunidade sulamericana de Plone que este ano aconteceu em Brasília, no Auditório do Interlegis.

Vejo no assunto tratado pontos positivos e negativos, infelizmente pelo que pude perceber como ponto negativo é que muitos ainda desconhecem o Varnish, e pior, desconhecem o que é um cache, muitos já ouviram falar, mas não estão tão preocupados em saber se tem um servidor de cache por trás do site.

Alo interessante é que com o assunto Diazo em questão, todo o resto do Plone parece desnecessário :) pelo menos para mim é o que ficou muito visível, e isso é bom claro, apesar da minha palestra não ter a ver com o Diazo, o Plone por padrão não vem com suporte a ESI / SSI (Edge side includes / Server side include), dai minha citação sobre o Diazo. 

"Hoje temos algumas formas que adicionar cache em partes de nosso site, isso mesmo, imagine você poder colocar um cache diferente para cada parte da sua Home, 5 minutos de cache em um portlet de imagens, 1 mês de cache para o rodapé do site, banners sem cache e assim vai." 

Não quero escrever aqui toda a palestra então você pode assistir a palestra ou e também visualizar os slides abaixo.
 
http://www.youtube.com/watch?v=QxG6TItDCfg
 
| Comentários

Visitas ilustres na Simples Consultoria

Posted by André Nogueira at 24/08/2012 15:34

Na última sexta-feira recebemos a visita de dois core developers do Plone: Liz Leddy e Nejc Zupan. A caminho de Brasília, onde participam do Plone Symposium South América, Liz e Nejc aproveitaram para conhecer o escritório da Simples Consultoria e utilizar nosso sistema de Desk Surfing.

Nejc Zupan e Liz Leddy

Mais do que uma mesa, Desk Surfing é um conceito que a Simples Consultoria criou para receber de braços abertos em seu escritório todos os desenvolvedores que trabalham diretamente com o Plone. Se você é um Core Developer do Plone, aqui sempre terá um espaço para você.

| Comentários

Primeiro dia do Plone Symposium

Posted by André Nogueira at 23/08/2012 17:39

Começou ontem a quarta edição do Plone Symposium South America, o encontro da comunidade sulamericana de Plone. Este ano o evento acontece em Brasília, no Auditório do Interlegis, e além das presenças já tradicionais conta com 2 palestrantes de outros continentes: Elizabet Leddy e Nejc Zupan.

Plone Symposium South America 2012

Este ano só pude participar durante o primeiro dia, e por isso acabei não aproveitando como deveria as palestras. Então os  Mas foi o suficiente para encontrar as pessoas e ter muitas conversas interessantes sobre o Plone e tudo o que acontece ao redor.

Quem tambem não puder participar pode acompanhar as palestras pelo streming:

http://www.interlegis.leg.br/produtos_servicos/infra-estrutura/videoconferencia/videoconferencia-na-internet-ii

| Comentários

Plone 4.2 é lançado com muitas novidades

Posted by André Nogueira at 06/07/2012 17:20

A comunidade Plone acaba de anunciar o lançamento da sua mais nova versão, o  Plone 4.2. Apesar de ser um release menor, a nova versão foi muito além da simples correção bugs e trouxe três novidades que a tornam tão importante quanto um release principal: novas coleções, novo resultado de busca e a integração do Diazo com o plone.app.theming.

Novas Coleções

Coleção é um dos principais recursos do Plone desde sua versão 2. Ela permite a criação de listas dinâmicas baseadas em critérios, sem a necessidade de nenhuma linha de código. A nova versão das coleções lançada com o Plone 4.2 tem uma estrutura muito mais leve, trazendo muita melhoria de desempenho. Além disso a sua interface foi melhorada, tornando muito mais fácil e rápida a sua configuração. Agora é possível visualizar uma prévia do resultado antes mesmo de salvar a sua coleção.

Novas COleções no Plone 4.2

 

Resultado das Buscas

A página de resultado de buscas ficou muito mais organizada visualmente e possui agora a possibilidade de ordenar e filtrar os resultados.

Diazo

Diazo é a nova maneira de criar temas para alterar a aparência de um site Plone. Com o Diazo você pode aplicar um HTML pré existente (e seus estilos) em um site Plone, sem necessidade conhecer o funcionamento do Plone. Para entende melhor o funcionamento do Diazo, recomendo a leitura do artigo de John Stahl: diazo + plone.app.theming for non-developers (em Inglês).

 

Para mais detalhes e baixar a nova versão do Plone acesse: http://plone.org/products/plone/releases/4.2

Boa diversão!

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 9

Posted by Héctor Velarde at 04/07/2012 13:15
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 9

Day 9 (Thursday, June 28)

Early in the morning hvelarde get mad when he realized the team had only 2 days to complete the sprint and not enough work had been done on the tiles stuff yet. We had to change that!

Happily, agnogueira had created a bunch of tile mockups so we could concentrate on this.

Frontend Team

flecox implemented some UI on the permission stuff developed by frapell.

quimera stopped working on the resizing of the columns, for now; he implemented the delete tile feature and the UI to show if a tile allows certain content type to be dragged on it.

Backend Team

frapell added a permission check to the populate_with_object method so it won't modify an object if the user has no permission to do so.

jpg_rcom fixed a bug in the data manager that was affecting the creation of the tile and implemented the basic tile image scaling. Now, when the object dragged to a tile contains an image, the tile shows it. Great!

hvelarde created a file tile, removed a bunch of legacy code and added more tests to the package.

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 8

Posted by Héctor Velarde at 28/06/2012 21:46
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 8

Day 8 (Wednesday, June 27)

Oliver joined the sprinters and succeeded to commit his first sprint group photo.

Frontend Team

quimera spent the whole day trying to implement columns drag&drop; he almost succeeded… Holy cow! Did I said "almost"?

flecox added support for column permissions on the layout user interface. Now you can set group permissions to all tiles inside a column in an easy way: if a user does not belong to a group with editing permissions on a tile, he will not be able to modify the content on it.

Backend Team

frapell added plone.app.stagingbehavior to provide versioning, working copy, and locking functionality. He also created an event to move annotations from the working copy to the baseline when a check-in is applied.

jpg_rcom created a custom ITileDataManager to store image modification time.

hvelarde replaced the way we were registering tiles for the package: we now use plone.registry and we have a vocabulary for listing the available tiles; he also made some code cleaup.

Have you tried the package lately? It's really amazing!

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 7

Posted by Héctor Velarde at 27/06/2012 14:30
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 7

Day 7 (Tuesday, June 26)

Frontend Team

quimera worked on the drag&drop feature for tiles and columns; he also fixed many bugs. We can now create and save layouts; we only need to implement more tiles now.

flecox worked on modal windows to select the type of tile being added to a layout and to configure them.

davi-lima made some code cleanup.

Backend Team

frapell worked on adding a permission subsystem, so now we are able to grant groups permissions to edit tiles content. The edit-tile view now checks for that when trying to render, and it will raise an Unauthorized exception if the user doesn’t belong to the specific group. Kudos!

jpg_rcom fixed the basic tile he started last week, and started implementing an image field with blob support.

hvelarde cleaned up the buildout configuration used for development, and implemented locking behavior for the composition content type.

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 6

Posted by Héctor Velarde at 27/06/2012 12:50
Filed under: JQuery, Sprint, usabilidade, Plone
 Special report from São Paulo, Brazil: Cafecito Sprint Day 6

Day 6 (Monday, June 25)

Frontend Team

quimera continued working on the edition of layouts: he added a Saving event, error handling for the Save action, fixed the JSON structure in the layout view and made other minor fixes.

flecox worked on the column resizing feature and the Content Tree screenlet.

davi-lima made some refactoring on the tile template for the layout.

agnogueira created a set of tile mockups that we will need to implement on the first release of the package.

Backend Team

frapell continued working on the tile configlets based on z3c.form; he also added configuration templates for base widgets, richtext widgets and textline widgets, and added a new data manager for the tiles, so we can handle configurations before they are rendered.

nueces added a "tail" for a collection content type; we are still trying to figure out where to put it on the package.

hvelarde worked on packaging and documentation stuff, and spent most of the evening understanding, the wrong way, that sometimes collaboration in Open Source projects among different languages, cultures, and time zones is hard.

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 5

Posted by Héctor Velarde at 25/06/2012 20:05
Filed under: JQuery, Sprint, Usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 5

Day 5 (Friday, June 22)

Frontend Team

flecox and davi-lima continued to work on the screenlets, implementing both the Recent Items and Content Tree tabs and also making room for the clipboard one, which will be developed next (based on a catalog filter for content UUID).

quimera implemented a Save functionality to export the designed layout into a JSON structure which is AJAX-stored as an annotation in the context. That was amazing!

They also spent big time debugging and cleaning up the code as well as preparing icons, internationalizing and localizing templates and improving documentation.

Backend

frapell updated package's documentation to explain how to create a tile to use in the composition; he also made a configuration template for automatic rendering a Configure mode for the widgets in the tile by using z3c.form. Really cool!

hvelarde worked on moving Carlos de la Guardia's original collective.composition repository to the Collective just to have the issue tracker there; he also added i18n code to plone.app.tiles and Brazilian Portuguese and Spanish translations to the package, and tried to fix the basic tile but he failed miserably: wish him better luck next time.

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 4

Posted by Héctor Velarde at 22/06/2012 18:45
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 4

Day 4 (Thursday, June 21)

The day started with a hangout of the sprinters with Rok Garbas (garbas); he has been working on plone.app.deco lately and he wanted to find out if we can collaborate in some way.

We followed closely his presentation and explained him that the goal of the sprint is to release an usable package to create front pages for projects we are working on, and to release it for the community.

Maybe after that we can start looking how to generalize what we are learning.

Frontend Team

davi-lima and flecox worked on refactoring the "screenlet" mechanism for providing the windows and overlays that will display tools and settings used in the Compose and Layout tabs for the Composition object. The work is not finished but the screenlet also knows how to update itself based on user interaction, like content filtering, based on text filters and eventually tabs.

quimera worked in the HTML serialization of a created layout and the save functionality.

Backend Team

Juan Pablo Giménez (jpg_rcom) joined (remotely from Rosario, Argentina) frapell on the backend team; jpg_rcom is a long time Plone contributor and co-author of Plone 3 Products Development Cookbook book.

frapell tried to implement a configuration view for the tiles. This view will allow us to adjust how fields will show up: we could have a tile that displays a title, a description and an image and we will be able to change the order of the fields, the alignment of the text or the size of the image.

jpg_rcom created a new basic tile that will display title, summary and an image for most standard content types.

agnogueira and hvelarde found a nice icon for the package; if only we could find a good name also…

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 3

Posted by Héctor Velarde at 21/06/2012 18:40
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 3

Day 3 (Wednesday, June 20)

We need your help to find a better name for this package!

If you have an idea, please let us know.

Frontend Team

flecox created a screenlet to search for content types and drag&drop them on tiles, after the drop is done an AJAX call send the UID of the object and the id of the tile and return the HTML of the tile with the data of the content.

quimera decided to divide in two the layout: layout view to create the “layout” with rows and cells and a permissions view to wrap the parts of the layouts in groups and add permissions to them.

Backend Team

frapell made some advances adding functionality that will allow to send an object to a tile and update its content, and to delete tiles data to maintain integrity.

A major change was made into the way the composition use the layout. Now, the layout gets stored in the composition itself, so it is independent from what it is in the registry, and from other compositions. In the moment that the composition gets created, random ids get assigned to the tiles.

Some bug fixes were tackled too, and more functionality was included into the recursive layout renderer, which can identify which view is being rendered on, and can render different content accordingly.

And finally, a new functionality was included into the tiles, that will allow to return a list of accepted content types that can be dropped into a tile.

hvelarde spent part of the day preparing the blog posts for the first two days of the sprint and made some code review (mainly PEP 8/Pyflakes) to Plone core packages like plone.app.blocks, plone.app.tiles and plone.tiles.

At the end of the day both teams merged code and got something almost usable; the day was very productive and what we have now looks pretty good!

Download the development buildout and check it by yourself ;-)

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 2

Posted by Héctor Velarde at 20/06/2012 14:30
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 2

Day 2 (Tuesday, June 19)

Frontend Team

Ricardo Bánffy (rbanffy) joined agnogueira, davi-lima, flecox and quimera on the front end team; rbanffy is founding member of Associação Python Brasil and long time technology advisor at Simples Consultoria.

Once again the team begun the day discussing the implementation of the whole front end, with lots of drawings in the whiteboard. The team realized that, to be grid-friendly, they need to allow users to draw all the possible layouts with our “Groups” and “Tiles” entities and then implement the right combination of “row” and “cell” CSS classes from Deco.gs (or the similar ones from the other grid systems).

The team noticed they are going to have a lot of trouble very soon dealing with nested rows, cells and all their width calculation using percentage values . They decided to start with baby steps and, following the mockups, create a simple static layout that can´t be modified, but can be used by an “Editor” to add content to the static tiles.

Finally, they discussed the format of the JSON they'll deliver to the backend to inform about the structure of the created layout.

Backend Team

The layout data structure was initially designed by frapell, and he also implemented a recursive renderer for it. Finally, the layout structure was included in the main composite view and a temporal way of editing the tiles was added.

Unneeded code was successfully removed by hvelarde; he also added some basic tests and made some updates on i18n.

| Comentários

Special report from São Paulo, Brazil: Cafecito Sprint Day 1

Posted by Héctor Velarde at 20/06/2012 12:30
Filed under: JQuery, Sprint, usabilidade, Plone
Special report from São Paulo, Brazil: Cafecito Sprint Day 1

Day 1 (Monday, June 18)

Work started late thanks to a broken fiber optics cable brought to us by Vivo (Telefônica Brasil).

Coffee after lunch was courtesy of Leo's Cafecito.

Frontend Team

The team was formed by agnogueira, davi-lima, flecox and quimera.

They begun the day discussing how some grid systems (like Deco.gs) can disturb responsive design principles, with rows preventing cells from floating one below the other when screen is shrinked. So, even though inspired by Deco.gs, they decided to begin with their own set of CSS classes to indicate widths and floats, but not positions.

For tiles' drag&drop and resizing functionalities they chose to start with jQuery UI since it's being included in Plone anyway. The team decided to begin with the resizing so they wrote code implementing the "Groups and Tiles" mockup as a proof of concept. They couldn't use the native snap functionality, because of the lack of a "snap" event in the resize API, so they found some trouble calculating exactly when enough pixels were dragged to update the tile CSS class which defines its width. At first they tried binding the math into the jQuery UI resize event but it was too expensive and lagged, so they went for start and stop events.

Generally it was a nice first day ending with important discussions with the backend team on how we'll persist the layouts after the user presses the Save button on the Layout tab.

Backend Team

The team was formed by frapell, hvelarde and nueces.

The team decided to take on the problem using the collective.composition approach. Based on a blog post by David Glick, they merged back the tiles implementation in collective.composition from frapell's fork and moved the package into the Collective. The idea was to remove some of the content types implemented and start adding different tiles types.

They debated a bit on which would be the best implementation, first they wanted to use recursive tiles and implement a “folder” tile to hold other tiles, but plone.app.blocks doesn’t work that way. So, the main idea will be to use panels to store the tiles. Then they’ll store the panels and tiles HTML structure in a field for the "Composition” object. This way we can have versioning and working copy for free. Global layouts will be added in the Plone registry, that way, we can use Generic Setup to import and export layouts.

Take a look (and help out!) at the full development buildout running on https://github.com/collective/collective.composition.

| Comentários

Suporte SPDY no Nginx se aproxima.

Posted by Cleber J Santos at 18/06/2012 12:00
Filed under: Performance, Infra, Tuning, Nginx

Recentemente um dos desenvolvedores do Nginx Valentin Bartenev, anunciou o suporte SPDY para o servidor web Nginx. SPDY (pronunciado speedy), trata-se de um protocolo de rede experimental desenvolvido essencialmente no Google para transporte de conteúdo web e focado em fazer a Web mais rápida.

Apesar de não ser atualmente um protocolo padrão, o grupo que está desenvolvendo o SPDY afirmou publicamente que está trabalhando em direção a uma padronização, e tem implementações de referência no momento disponíveis em ambos Google Chrome e Mozilla Firefox. O protocolo é similar ao HTTP, tendo como objetivo reduzir o tempo de carga de páginas da internet. Isso é conseguido priorizando e multiplexando a transferência dos sub-recursos da página web para que somente uma conexão por cliente seja necessária.

 Encriptação TLS é praticamente onipresente nas implementações do SPDY, e a transmissões são comprimidas com gzip ou DEFLATE em contraste ao HTTP, em que os cabeçalhos não são comprimidos. Além disso, o servidor indica ou até mesmo envia conteúdo ao invés de esperar requisições individuais para cada recurso de uma página. O nome não é um sigla, mas um versão reduzida da palavra "speedy" do inglês.

Este trabalho foi patrocinado pela Automattic que desde 2008 utilizam Nginx e desde então tem feito parte de quase todas as peças de sua infra.

Desde 2011 a empresa já conversava com o pessoal da Nginx para fechar um acordo, onde a Automattic iria patrocinar o desenvolvimento e a integração do SPDY no Nginx, tendo como única exigência final que que o código resultante deva ser liberado sob uma licença de código aberto para que outros possam se beneficiar de todo o trabalho.

Já existem extensões para as versões recentes dos navegadores Google Chrome e Mozilla Firefox que permitem saber se um site já implementam o SPDY, visitando o próprio Google ou o Twitter já podemos perceber que utilizam o protocolo.

“We’d like to say big thanks to the team at Automattic and especially to Pyry Hakulinen who has been great in helping us test and debug this first public version of SPDY module for nginx. Automattic is a great partner, and we will continue to work with Barry and his team on improvements to nginx and to nginx/SPDY in particular.”

Andrew Alexeev – Nginx, Inc.

E melhor que usso, percebi que apenas este site https://barry.wordpress.com implementa o SPDY no Nginx, quando acessado através de SSL e que trata-se do blog de Barry, o atual chefe de sistemas Wrangler na Automattic e responsável pela execução da infra-estrutura distribuída globalmente, no qual deu nota e alguns detalhes da implementação do SPDY no Blog.

 

O futudo do SPDY será fazer parte da fonte oficial do servidor web Nginx, e confesso, estou ansioso para já testar tudo :) então nos próximos dias irei postar novidades sobre os testes, é claro que para quem desejar já testar pode já pegar os patches beta em http://goo.gl/SlaiA.

Para você que deseja também testar o SPDY com o Nginx, leia o link http://nginx.org/patches/spdy/README.txt.

Desvantagens

Pois é, infelizmente nem tudo são flores, duas desvantagens são:
 
  • O conteúdo enviado mesmo que já haja cache é um desperdício de banda.
  • Softwares de filtragem que dependem do HTTP não funcionarão mais.
  • Muito provável que o IE vai demorar para implementar o suporte a este protocolo.
 

Você sabia?

 
  • O navegador Google Chrome e o Chromium já utilizam o SPDY quando se comunicam com os serviços do Google, como o Google Search, Gmail, Chrome sync e quando exibindo anúncios do Google. O Google reconhece que o uso do SPDY é habilitado em comunicações entre o Chrome e os servidores do Google que usam SSL.
  • A partir da versão 11 do Mozilla Firefox e SeaMonkey V2.8 existe o suporte a SPDY, apesar de não ser habilitado por padrão. O suporte pode ser habilitado através da preferencia network.http.spdy.enabled preference em about:config.
  • No Firefox 13 o SPDY é habilitado por padrão.
  • Também no Google Chrome há um parâmetro de linha de comando (--enable-websocket-over-spdy) que habilita uma implementação experimental do WebSocket sobre SPDY.
  • E também podemos utilizar o Google Chrome para inspecionar as sessões do SPDY, acessando uma URL especial: 
chrome://net-internals/#events&q=type:SPDY_SESSION%20is:active
Para mais informações sobre as especificação do protocolo por favor acesse:  http://www.chromium.org/spdy/spdy-protocol
| Comentários

Cafecito Sprint

Posted by André Nogueira at 13/06/2012 14:19

Nas próximas duas semanas vamos realizar aqui na Simples Consultoria a primeira edição do Cafecito Sprint. O objetivo principal da criação desse sprint é trabalhar com a interface do Plone, corrigindo bugs ou criando novos produtos que aprimorem a experiência do usuário final.

Para quem não conhece o conceito, um sprint é um evento muito comum no mundo open source, onde diversos profissionais se reunem para trabalhar no código de um software, corrigindo bugs ou implementando novos recursos.

Nessa primeira edição o objetivo será a criação de um produto para a gestão de capas (páginas inicias) que seja ao mesmo tempo completo e fácil de usar.

Veja mais detalhes sobre o evento no Plone.org.br e descubra a origem do nome desse sprint.

Cafecito Sprint 

| Comentários

Participação da Simples Consultoria no World Plone Day Brasília

Posted by André Nogueira at 02/05/2012 15:45

No último dia 25 de abril aconteceu em todo mundo o World Plone Day, uma iniciativa da comunidade Plone para divular o Plone com a realização de diversos eventos. Em 2012 foram realizados simultaneamente  34 eventos em 20 países diferentes.

Eu tive a oportunidade e a honra de participar do World Plone Day Brasília, organizado pela comunidade Plonegovbr e pelo Interlegis. Muito bem organizado diga-se de passagem. Diversas oficinas, palestras e uma excelente discussão sobre o compartilhamento de código pelo governo. Discussão que ainda vai render um post, mas fica para depois.

Durante o evento fiz duas palestras e uma oficina. Foram elas:

Estado do Plone

Como funciona a comunidade e o desenvolvimento do Plone.
Novidades das versões 4.2, 4,3 e 5.


Espero ter conseguido passar para as pessoas a necessidade de contribuir e participar da comunidade.

Oficina de Diazo

Conceitos básicos de Diazo, e um passo a passo bem simples para deixar claro os principais conceitos da utilização do Diazo.

Simplificando o Plone

Novidades apresentadas pela Simples Consultoria durante o World Plone Day: Core Developer Desk, Ploud.com.br e o novo Manual do Plone, que agora virou livro. Mais detalhes sobre essas novidades aqui no site.

| Comentários

Python: Google and April Fool's Day

Posted by Cleber J Santos at 09/04/2012 01:16
Filed under: Python, Google

Como bem sabemos o dia da mentira é comemorado por todos e por muitas empresas, até mesmo o Google entrou nessa, e este ano não foi diferente, porém o que venho postar não é sobre o dia da mentira ou sobre as brincadeiras que o Google tem feito, apesar de serem muito divertidas.

O que me chamou a atenção foi o tal do Elegantizr que foi divulgado como um framework que promete deixar o site até 3 vezes mais rápido, e pior, muita gente mesmo caiu nessa!

Risadas a parte, a brincadeira foi tão legal que logo eu quis saber como foi feita. É bem provável que muitos venham a dizer que é algo super simples e etc, porém vale ainda assim blogar.

A brincadeira.

 Trata-se de um arquivo de CSS (http://www.google.com/landing/elegantizr/elegantizr.css) que deve ser incorporado no site:
 
<link rel="stylesheet" href="http://www.google.com/landing/elegantizr/elegantizr.css" />
Analisando o conteúdo do arquivo teremos o seguinte código:
 
:before {
  content: '\41\50\52\49\4C\20\46\4F\4F\4C\20\F4\BF\F4';
}
 
Não entendo muito das mágicas do CSS, e tive que recorrer a pessoas mais confiáveis no assunto como o @agnogueira, @Tamosauskas e o @google, no qual me informaram que  trata-se de pseudo-elementos e que neste caso temos vários, dentre eles temos o before e after que são usados para gerar conteúdos antes e depois do conteúdo de um elemento.
 
A seguir uma exemplo de como :before e :after podem ser usados para inserir a URL logo após o texto de um link ou antes de um texto de um link:
 
Antes do texto de um link.
a:link:before {
  content: " (" attr(href) ") ";
}

Depois do texto de um link.

a:link:after {
   content: " (" attr(href) ") ";
}
Agora não quero me focar em CSS, então espero que os amigos @agnogueira@Tamosauskas possam blogar algo sobre os pseudo-elementos de CSS :D
 

Como fazer.

Agora entramos na parte que gosto, notem que destaquei o trecho do código que é:
 
'\41\50\52\49\4C\20\46\4F\4F\4C\20\F4\BF\F4'
Aqui é onde a brincadeira acontece, este código ai acima trata-se de um texto (string) convertido em hexadecimal, vamos para um exemplo rápido:
 
 
>>> text = 'APRIL FOOL ô¿ô'
>>> text.encode('hex').upper()
'415052494C20464F4F4C20C3B4C2BFC3B4'
 
Note que no meu exemplo o código aparece diferente, isso por que o meu Python está usando encode utf8 como padrão, vejamos agora usando iso-8859-1.
 
>>> text = 'APRIL FOOL ô¿ô'
>>> text.encode('iso-8859-1').encode('hex').upper()
'415052494C20464F4F4C20F4BFF4'
 
Agora o que nos falta é adicionar a cada dois objetos uma barra invertida '\', e teremos:
 
'\41\50\52\49\4C\20\46\4F\4F\4C\20\F4\BF\F4'
A idéia não é mostrar exatamente como foi feito claro, ou seja, fica por conta colocar as barras a cada duas strings como feito acima, porém isso pode ser feito também com Python.
 
Para finalizar fiz este abaixo que irá imprimir a frase Python antes de cada item, note que o procedimento é o mesmo.
 
A conversão.
>>> text = 'Python'
>>> text.encode('iso-8859-1').encode('hex').upper()
'507974686F6E'

O Css.
:before {
  content: '\50\79\74\68\6F\6E';
}


Até a próxima.

| Comentários

Design responsivo com Plone tem novo release

Posted by Érico Andrei at 21/03/2012 18:55
Filed under: Tablet, Plone 4, Design, Tema, Plone

Acabamos de fazer o release da versão 0.3 do beyondskins.responsive, design responsivo para sites Plone com a tecnologia Diazo.

Design responsivo com Plone tem novo release | Comentários

Read More…

Dropbox como serviço em servidores Windows

Posted by Érico Andrei at 20/03/2012 13:33
Filed under: Windows, SysAdmin, Dropbox

Não é Python, não é Plone, não é Web, mas é útil. Se você tem um servidor Windows e quer usar o Dropbox como serviço, este é o passo a passo.

Dropbox como serviço em servidores Windows | Comentários

Read More…

JavaScript Minify com Python

Posted by Cleber J Santos at 17/03/2012 19:30
JavaScript Minify com Python

Trabalhando em um projeto recentemente precisei gerar um arquivo menor do jQuery que eu havia modificado, e com isso comecei a me perguntar como o jquery.com o fazia com seus arquivos por exemplo: 

  • jquery-1.7.1.js 244K
  • jquery-1.7.1.min.js 92K

Notaram  a diferença de tamanho? Pois bem, isso me levou a pesquisas, que por sua vez me levou a diversos resultados, uma delas é o link http://www.refresh-sf.com/yui/ que nada mais é que uma interface Web que reduz o arquivo como eu queria fazer.
 
Porém que queria mais que isso, não quero depender de entrar em um site para gerar um arquivo menor, então achei Egg que faz exatamente o que eu queria, e melhor que isso, é pytonica :D http://pypi.python.org/pypi/jsmin
 
Vamos então a solução, para isso vamos usar o próprio jQuery só para testarmos que funciona após ter minimizado o tamanho do arquivo, é claro que isso é apenas um teste, pois o jQuery já lhe dará o arquivo dele como mostrado acima, compactado.
 
Vamos criar uma pasta chamada cobaia, dentro dessa pasta baixe o arquivo mencionado e visualize o tamanho dele:
 
$ mkdir cobaia
$ curl -O http://code.jquery.com/jquery-1.4.4.js
$ ls -hs *.js
No momento você verá o que o arquivo contém 180K, agora vamos criar um arquivo menor. Instale o egg jsmin no seu python com o comando:
 
$ easy_install jsmin
Ou 
$ pip install jsmin
Feito isso acesse o prompt do Python (Estou usando Python 2.6) e vamos converter assim:
$ python
>>> from os import path
>>> from os.path import join
>>>
>>> # Usei o cStringIO por ser mais rápido que o StringIO implementado em Python
>>> from cStringIO import StringIO
>>> 
>>> # As linha abaixo é o que nos garante o uso do jsmin
>>> import jsmin
>>> jmin = jsmin.JavascriptMinify()
>>>
>>> base = path.dirname(path.abspath(path.realpath(__name__)))
>>>
>>> # Abrimos o arquivo original apenas como leitura 
>>> filejs = open(join(base, 'jquery-1.4.4.js'),'r')
>>>
>>> # Pegamos o nome do arquivo original e concatenamos com .min.js
>>> filename_out =  str(str(filejs.name.split('/')[-1]).split('.js')[0] + '.min.js')
>>>
>>> file_out = StringIO()
>>> file_out.write("")
>>>
>>> # Gerando um novo arquivo com modo de escrita
>>> file_out = open(join(base, filename_out),'wb')
>>>
>>> # Por fim passamos para o minify um arquivo de entrada e o de saída
>>> jmin.minify(filejs,file_out)
>>> file_out.close()
 
CTRL+D para sair do console python.
 
Mantive o exemplo acima comentado para que possam melhor entender o que foi feito. Agora podemos usar novamente o comando para ver o tamanho dos arquivos, antes e depois.
$ ls -hs *.js
Note que agora temos um novo arquivo com o nome de jquery-1.4.4.min.js com apenas 112k, pode não parecer muito, mas tenha certeza que isso ajuda muito no desempenho do seu site, ainda mais se você tiver bem mais arquivos.
 
Fiz este mesmo teste em um arquivo que eu tinha de 152k e ele foi para 64k, então veja bem a diferença. Vale testar com seus arquivos, claro que é sempre bom fazer um backup antes ;)

Outra forma de fazer.

Essa é a outra forma de fazer, mas não é pythonica. Achei importante mencionar essa outra forma de fazer, que na verdade é exatamente de onde partiu a idéia em Python e provavelmente as demais ;)
 
O código e projeto original do JSMin é escrito e mantido por Douglas Crockford em C e pode ser acessado em https://github.com/douglascrockford/JSMin.
 
Jsmin é um filtro que omite ou modifica alguns caracteres. Isto não altera o comportamento do programa que estamos reduzindo. O resultado pode ser mais difícil depurar. Vai ser mais difícil de ler.
 
Após baixar o jsmin.c, vamos compilar e usar, abaixo mostro como compilar e como usar, lembrando que estamos usando o arquivo do jquery como modelo. O comando segue o mesmo modelo que em Python, neste caso o binário do jsmin também requer um arquivo de entrada e outro de saída.
 
$ gcc jsmin.c -o jsmin
$ ./jsmin < jquery-1.4.4.js > jquery-1.4.4.min.js
Pronto! Agora temos um arquivo com 108k, menor ainda que o gerado em Python :D
 

O pulo do gato.

Descobri ainda que o jQuery usa o chamado packer (http://dean.edwards.name/packer/) que nada mais é que um compressor de JavaScript, após passar o arquivo que temos de 108k o resultado foi 60k, então aqui descobrimos o pulo do grato usado pelo jQuery.
 
É isso ai, agora você já pode começar a se divertir e colocar um pouco mais de performance em seu site.
| Comentários
Document Actions
Spinner