Analyzing FastestWebsiteEver

Checking https://github.com/diracdeltas/FastestWebsiteEver was on my TODO list. Let’s see some details in Wireshark and review some TCP/IP details.

Captura de pantalla 2017-09-30 a las 3.19.38.png

You can check http://packet.city/ if you want to avoid setting up the service yourself.

So you open Wireshark and you start capturing. Visit http://packet.city and you can use a Wireshark filter for the resolved IP for packet.city.

Captura de pantalla 2017-09-30 a las 2.11.30.png

The project states that it is “the greatest website to ever fit in a single TCP packet”.

Is it true? Let’see what it needs: I can see 9 packets and some details.

First 3 packets (handshake)

Captura de pantalla 2017-09-30 a las 3.03.49.png

Like any normal TCP connection we start with a 3-way handshake:

  • First, my laptop sends a SYN packet with an Initial Sequence Number which can be seen 0 in Wireshark but that’s actually a relative over a random. This is my laptop requesting proof that its message can get through.

Captura de pantalla 2017-09-30 a las 2.28.14.png

  • The server needs to send an ACK packet (to prove SYN received) and its own SYN (to prove it can reach the client). We can see it’s actually done in the same sent packet: SYN-ACK

Captura de pantalla 2017-09-30 a las 2.30.49.png

  • My laptop receives the SYN-ACK: as its an ACK it knows it can send a packet to the server and as its a SYN it knows that the server needs an ACK, so it sends such ACK.

Captura de pantalla 2017-09-30 a las 2.35.54

  • Once the server receives that ACK handshake has finished and the channel is considered feasible. However it might have been like, but this is the minimum to start trying to communicate.

Packet #4 (GET)

We’ve finished with the 3 first packets. The fourth one is the GET request.

Captura de pantalla 2017-09-30 a las 2.41.10

Captura de pantalla 2017-09-30 a las 2.48.50.png

Notice that Push flag is enabled (PSH) and also ACK as with any exchanged packet during the communication.

In HyperText Transport Protocol we can see the sent HTTP request:

Captura de pantalla 2017-09-30 a las 2.52.48

#5 and #6 packets

Captura de pantalla 2017-09-30 a las 3.04.41.png

Packet #5 is an ACK:

Captura de pantalla 2017-09-30 a las 3.00.10

Next packet is the HTTP GET response:

Captura de pantalla 2017-09-30 a las 3.02.55.png

I guess this is what the project describes as “send response immediately after TCP session init”

I think PSH is enabled because Nagle’s algorithm is disabled as the project describes too.

In Hypertext Transfer Protocol section we can see DEFLATE compression is being used, again exactly as described in README.

Captura de pantalla 2017-09-30 a las 3.13.12.png

See that Response is “200 k” instead of “200 OK”: 1 byte saved there.

Content encoded is 1163 bytes (1547 bytes decoded), far from needing fragmentation:

The maximum would be 1460 bytes for content and 40 bytes for IP and TCP headers.

In this case, the frame is 1292 bytes, TCP segment length is 1226 bytes and HTTP Content-Length is 1163 bytes, in detail:

ethernet_frame

  • Frame header (14 bytes): 7 bytes for preamble, 1 byte for SFD, 12 bytes for source and destination MACs and 2 bytes for packet type (IP) –> 22 bytes (14 ignoring preamble and SFD)

Captura de pantalla 2017-09-30 a las 9.49.08.png

  • IP header (20 bytes): 1 byte for ip.version (4), 1 byte for ip.dsfield, 2 bytes for ip.len (Length), 2 bytes for ip.id (ID), 1 byte for ip.flags (0x02, ip.flags.df (Don’t Fragment  )is set), 2 bytes for ip.frag_offset (Fragment Offset), 1 byte for ip.ttl (TTL), 1 byte for ip.proto (Protocol), 2 bytes for ip.checksum (Header checksum) and 8 bytes for ip.src and ip.dst.

TCP-Header.png

  • TCP header (32 bytes): 4 bytes for tcp.srcport and tcp.dstport, 4 bytes for tcp.seq (Sequence Number), 4 bytes for tcp.ack (Ack Number), 2 bytes for tcp.flags, 2 bytes for tcp.window_size_value, 2 bytes for tcp.checksum, 2 bytes for tcp.urgent_pointer, 12 bytes for tcp.options

Captura de pantalla 2017-09-30 a las 10.17.44.png

  • HTTP (1226 bytes): 15 bytes for “HTTP/1.1 200 k\n”, 21 bytes for http.content_length_header, 26 bytes for http.content_encoding_header, 1 byte of “\n” and 1163 bytes for Content (encoded)

About the HTTP response content, it’s easier seeing the source code in the browser, there you’ll see:

Captura de pantalla 2017-09-30 a las 3.16.04.png

 

Last 3 packets

Finally last 3 packets. Server resets the connection with RST packet. I guess they could use FIN but RST is quicker. More about FIN vs RST.

Captura de pantalla 2017-09-30 a las 3.21.41.png

That’s all 🙂

 

 

An easy Vim IDE setup: using Vundle

Are you bored of messing up with your own custom .vimrc which is eventually broken or difficult to maintain?. Well, there are lots of projects in order to have a vim plugin environment well setup, I’ll just show one of them. I’m following the steps you can see in https://github.com/jez/vim-as-an-ide install instructions:

  1. First, let’s get Vundle:
mv ~/.vim ~/.vim.beforeVundleBackup
mv ~/.vimrc ~/.vimrc.beforeVundleBackup
mkdir ~/.vim && mkdir ~/.vim/bundle/
git clone https://github.com/gmarik/Vundle.vim ~/.vim/bundle/Vundle.vim

With that, you already have the bare minimum to work with Vundle.

       2. Follow this to get a proper font: https://github.com/jez/vim-as-an-ide/commit/457f2e2

If your using iTerm2 basically you need to download the solarized.zip file and load preset from the iterm2-color-solarized folder.

Captura de pantalla 2017-05-27 a las 8.42.20.png

Import both: “Solarized Dark” and “Solarized Light” and you can decide later which one is more convenient.

In iTerm2 make sure this is your terminal type (more info):

Captura de pantalla 2017-05-27 a las 9.07.01.png

     3. Now it’s time to get the vimrc:

wget https://github.com/jez/vim-as-an-ide/raw/master/vimrc.vim && mv vimrc.vim ~/.vimrc

     4. Now runvim +PluginInstall +qall

And that’s all, now your Vim should look like this:

Captura de pantalla 2017-05-27 a las 9.10.37

Now you already have a pretty good vim setup and you’ll be able to install new plugins easier.

e.g I can install a SML plugin just adding this to the .vimrc:

Just remember to run this every time you run a plugin:

vim +PluginInstall +qall

Implication, conditional, equivalence and biconditional: NL and code

This blog post is my attempt to explain these topics: implication, conditional, equivalence and biconditional.

I’ll also try to discuss examples both in natural language and code.

I’ve studied them in Mathematical Language subject and Introduction to Mathematical Thinking.

Implication

In natural language we often hear expressions or statements like this one:

If Athletic Bilbao wins, I’ll take a beer

Continue reading Implication, conditional, equivalence and biconditional: NL and code

Forks: wsdl2html_ivmos y wallahack_ivmos

25406

English

¿Qué hacer si tus pull requests no son aceptadas pero no quieres que esas aportaciones queden perdidas en ramas de tu fork? En mi opinión, para eso precisamente son los forks y es una de las ventajas del software libre. Lo suyo es probar primero una pull request, tratar de aportar al proyecto, es lo más práctico ya que el coste de mantener tu propio fork es considerable. Sin embargo a veces no es posible hacer que tus cambios lleguen al proyecto original y las razones pueden ser varias. Es algo que me ha ocurrido recientemente con dos pull requests:

https://github.com/ivmos/wsdl2html_ivmos

👍

Esta pull request entre otras cosas añade soporte a la utilidad wsdl2html para que se pueda autogenerar documentación en html a partir del proyecto. En este caso entiendo perfectamente porqué la pull request no se aceptó. Mi aproximación es muy específica para el caso de uso que me interesa: generar comentarios de un proyecto Java en el cual el WSDL se genera con JAX-WS en lugar de escribirse directamente. Genero los comentarios a partir de esos ficheros Java, lo cual es no es una forma útil si trabajas directamente con el WSDL.

https://github.com/ivmos/wallahack_ivmos

😞

Esta otra pull request sin embargo es bastante más triste. Sencillamente el autor nunca me contestó. Extendí la utilidad Wallahack, que permite consultar Wallapop haciendo scrapping de forma que puedes escribir scripts que busquen resultados periódicamente. Por ejemplo usé este fork durante un tiempo para detectar anuncios nuevos de ordenadores antiguos. La diferencia principal entre mi fork y el proyecto principal es que puede parametrizarse y tiene un par de arreglos que lo hacen usable.

En ambos casos no tengo suficiente tiempo ni interés para darles más evolución, por ello sigo la convención de renombrar sencillamente a {originalName}_ivmos.


Español

What should I do if my pull request aren’t accepted and I don’t want those changes to be lost as branches in your fork? IMHO, that’s actually the reason forks make sense and a main advantage of open source. You should try a pull request, with the needed effort to make it successful as maintaining your own fork can quite a pain. However sometimes it’s not possible and your pull request is not accepted. That’s something I’ve seen at least 2 times I’m telling you about:

https://github.com/ivmos/wsdl2html_ivmos

👍

This pull request is a branch which adds support to wsdl2html project. In this case I understand perfectly why the PR wasn’t accepted. My approach is very specific to the use case I had: generating comments from a java project where WSDL was generated with JAX-WS instead of being written manually. I generate the comments from those java files, which is an approach that does not make sense if you have worked directly with the WSDL (comments should be there).

https://github.com/ivmos/wallahack_ivmos

😞

This other PR is sad though. It was simply never answered. I extended Wallahack, which is a java tool which queries Wallapop web so that you can write scripts that poll periodically for results. For example, I used it to check whether new old computers had been posted recently.

In both cases I don’t have time to invest more time on them, that’s why I follow the convention of renaming the forked project to {originalName}_ivmos instead of using a new fancy name.

Product Hunt Madrid | Tuenti & Fever | Campus Madrid

English

Product Hunt Madrid es un evento de descubrimiento y crítica de productos y servicios digitales. Los productos se presentarán desde tres perspectivas: las decisiones de diseño tomadas, el stack tecnológico y el modelo de negocio. De esta forma la comunidad tecnológica de Madrid aprenderá cómo funcionan los mejores productos digitales del mundo.

Hace una semana estuve contando lo que hacemos en Tuenti con mis compañeros Laura Andina (UX) y Luis Javier Álvarez (Product).

Conté cómo trabajamos los equipos de ingeniería y algunas lecciones que hemos aprendido estos años.


Español

Product Hunt Madrid is an event where Product Managers, Engineers and Designers show their products: how they’re built and how they build them. Products are presented from three views: key design decisions, tech stack and business model. This way Madrid community can learn from the experience of successful digital products.

One week ago I talked about Tuenti product with my mates Laura Andina (UX) and Luis Javier Álvarez (Product).

I talked about how we work in Engineering team and a few lessons we’ve learned these years.

Ikusth: Android threads dependency graph generator

English

Tras una temporada dedicada especialmente a depurar deadlocks relacionados con nuestro componente XMPP decidí construir Ikusth. Básicamente realiza lo que solía hacer con boli y papel, escribe el grafo de dependencias con las hebras y recursos implicados.

Más información en la publicación que escribí para el blog de desarrollo de la compañía:

http://corporate.tuenti.com/en/dev/blog/Ikusth-Android-threads-dependency-graph-generator

Proyecto en Github:

https://github.com/tuenti/ikusth

Graph%202

Español

After some time debugging a few deadlocks related to the XMPP component we have I decided to build Ikusth. It basically does what I used to do on paper, write the dependency graph of the threads and resources involved in a deadlock.

More info in the blog post I wrote for my company dev Blog:

http://corporate.tuenti.com/en/dev/blog/Ikusth-Android-threads-dependency-graph-generator

Project in Github:

https://github.com/tuenti/ikusth

Graph%202