Tuesday 11 August 2015

Desarrollando wiklimb: Semana #2

Esta semana ha sido la semana reponsiva. Nunca me había tocado tener que adaptar un diseño a los dispositivos móviles, pero ha sido gratamente fácil. Puede que el resultado no sea perfecto, pero por ahora da respuesta a una de las primeras preguntas que siempre me hacen sobre wiklimb, ¿se puede ver desde el celular?

Ahora ya sí.


Me ha sorprendido lo fácil que ha sido adaptar wiklimb a una experiencia móvil usando únicamente CSS ( si queréis sorprenderos realmente con lo que se puede hacer con css: http://www.species-in-pieces.com/#). El único problema que he tenido ha sido probarlo, ya que no tengo acceso a ningún iPhone o algún Android moderno. Me he tenido que bastar con el emulador de Chrome.


La otra tarea en la que he estado centrado esta semana es mejorar el SEO (serch engine optimization) para que Wiklimb aparezca en los resultados de búsqueda en Google. Integrar PrettyFaces para reescribir las URLS, crear un sitemap según recomienda google y añadir las etiquetas meta correspondientes en cada página debidamente internacionalizadas han sido algunas de las tareas.

Funcionalidades Nuevas


  • Se ha agregado un titulo a cada topo/croquis de manera que se pueda identificar cada foto de un sector si es necesario.  
  • Página de herramientas: Se ha creado una pequeña página de herramientas con recomendaciones de programas de edición de imágen, online y offline.
  • Se ha mejorado el lightbox de las imágenes usando una Magnific Popup
  • Se ha mejorado la usabilidad al crear rutas: al crear una ruta nueva automáticamente habilita una nueva ruta vacía para ingresarla, lo que hace muy cómodo añadir muchas rutas a una zona nueva.
  • Se han corregido algunos errores y mejorado el rendimiento en algunos puntos.

Eso es todo por hoy. Esta semana no habrá desarrollo, ya que me centraré en mejorar la visibilidad y el número de usuarios de wiklimb.

No olvidéis seguirnos en Twitter!

Monday 3 August 2015

Desarrollando wiklimb: Semana #1

Hola!

Bienvenidos la primera entrada sobre el desarrollo de wiklimb, tarea que me ha mantenido ocupado en los últimos meses. Estas entradas serán semanales, resumiendo el trabajo de la semana, tanto a nivel de desarrollo como de otras actividades paralelas.

Nuevas funcionalidades

- Login con Facebook. Usando el SDK de Facebook ya no es necesario registrarse y luego entrar en la cuenta. Al usar el botón de Entrar con Facebook wiklimb crea automáticamente la cuenta y luego identifica al usuario, pidiendo los permisos mínimos necesarios al usuario. Nunca había trabajado con el login de fb, por lo que me ha llevado algo de tiempo. 

- Ya no hace falta estar registrado para para editar wiklimb. El objetivo es hacer aún más fácil editar y actualizar la información, sin obligar al usuario a registrarse o logearse como hace wikipedia.

- Se ha cambiado la disposición de los elementos a la hora de editar una zona y mejorado la respuesta de la página a diferentes resoluciones. 

- Se muestra un feedback al usuario cuando se está realizando alguna accion ajax, de forma que sepa que la página está trabajando. 

Por debajo

- Se ha añadido al proyecto test de unidad con una base de datos en memoria de manera que los tests sean independientes de su lugar de ejecución y no sean susceptibles a cambios en la BBDD. Algo que debería haber estado presente desde el inicio. Se integran JUnit + Spring + HSQL.


Esta semana

Para esta semana se empieza el desarrollo del necesitado historial de ediciones para una zona, de manera que no se pierda información por error o por malicia y se pueda volver a un estado anterior, tanto en una zona, sector, croquis o rutas. Además se podrá tener un historial de ediciones de cada usuario por lo que en un futuro se podría contar datos de los usuarios más activos. Terminada esta funcionalidad se dará terminada la Alpha y comenzará la versión Beta.

Un saludo,
Guillermo

Friday 3 July 2015

Marker Clusterer in Primefaces Gmap

Hi!

wiKlimb development is running smoothly and i'm learning a lot meanwhile. The latest feature it's clustering markers on the main google maps window.


Why clustering?

 As Google says too many markers can be a pain to render and gives poor usability to your users. wiKlimb right now does not need clustering as the numer of locations is low, but have to very close locations and the user may have a hard time selecting one of them with out zooming in.

Solution

1. Download last version of markerClusterer (I used markerclusterer_compiled.js at http://google-maps-utility-library-v3.g ... terer/src/)

2. Import script int your page:

3. Use PF gmap normally. wiKlimb main map for example:
4.Add the following code to the map page:

All your markers will be clustered, and clicking on a cluster fill zoom in to fit all of them.


If you update the map in any action you need to call clusterMarkers(); again in order to cluster the updated markers. For example, wiKlimb uses different buttons to filter the map by climbing style.


That's it!

Monday 15 June 2015

It's been a while!

It's been a while sinse I published my last entry on this blog, but my life has changed a little bit these last couple of months. I left my job at Santiago, moved to the beatiful city of Valparaiso, got a new job and my girlfriend moved to my place.

My new job it's a lot easier and somehow less challenging that the previous, but at last I have the time and will to work on a little project of mine: wiKlimb!

wiKlimb is a wiki for rock climbers: a place to get updated info of places to climb, warn other climbers about dangers or add new routes.

I pretend to release a testing Alpha in a couple of weeks as the developemnt it's going faster than expected. The core functionality is almost done but I want to add a couple of things, polish the appearence and in general deliver a relative good quality app.

The technologies i am using are:

-Primefaces 5.2
-Spring 4
-Hibernate 4.3
-Maven 3.2
-Jetty 9.2
-JDK 1.7

I pretend to deploy it  on some cloud service.

Here some screencaps:





More to come in the next weeks!

Wednesday 18 March 2015

New Maven Plugin: Junit Awards!

In my previous project I proposed a monthly award for promoting junit testing. None of the team members had written Junit Tests before (seems like it's not very common in IT consultancy) and they mostly see them as a waste of time. But soon they realized how usefull they are.

For encouraging them I proposed to give a free evening for the member that wrote the most tests in a month time. It was fun and developers, despite their lack of experience unit testing, created a good bunch of tests. Maybe the test weren't that good or complete, but at lest we had tests that could run every night.

The bad part: I did the test count by hand. It was only once a month and didn't expent much time anyway.

But fear not! If you are interested in doing something similiar I present you.

The Junit Award Maven Plugin

This plug in scans the entire src/test/java fould of your project searching for the @author tag of javadoc, getting the author name and increasing the count for it. Kind of simple for now.

The @author tag must be enclosed in a javadoc block like:

/**
* @author ggefaell
/*

/**
* @author Guillermo Gefaell
/* 

It generates a simple html page with the results.

For now i'm still seeing how to get the plugin to be avaliable at a repository, but you can follow this steps for runing it on your project.

  1. Add the plugin to your project's pom. 
  2. Run mvn junitward:awards on your project.
  3. The results are generated in the folder /target/junitaward/junitAwards.html

The next improvements are:
  • Get it to a repository so no forking-installing. Done
  • Add a "Since Date" parameter so you can know how many tests have been written in a time span.
  • Improving @author scan so it counts only in functions noted with @Test.
Hope you like it!

Edit: Chanded groupId to com.github.konum and deployed it to central repository, so you can use it directly as a plugin in your project's pom.

Edit 2: Version 1.2 is out! Thre optional parameters for the plugin for count tests since a given date, change tests root folder and a date pattern option. See more at githubproject. https://github.com/konum/JUnit-Awards

Wednesday 11 February 2015

Dynamic Joins for MyBatis 3: Loading Relationships on demand without the N+1 problem

At my last project at  work there was an entity, lets call it  Project, that was the center of the application. The Project had several relationships, and usally when you loaded a Project you need it with some of this relations, and furthermore, some relations of those relations.

In order to avoid  the n+1 problem, whe first started an aproach similiar to the one described in this post.

But soon the Mappers.xml started to get a mess. A real mess. Multiple resultMaps, lots of joins code in the mappers, adhoc solutions, etc....

We need another solution to be able to load an entity with just the relations we needed in the upper layer. The first solutions worked but felt kind of clumsy, with a Join<EntityName>.java for each entity, and several design problems (own relationships weren't posible, tow relations with the same entity where messy) and overall the solution was complex. Just a letter wrong and the joins woulnd't function or the result was wrong.

It did the work but I felt like it was not right. Why to write new clases for a join if all the information you need are on the Entitiy itself and its mapper? Version 2 of Dynamic Joins (DJ) was born.

What is it for?

 Lets use this model for the rest of the post.
  • An Author has a name and several Posts.
  • A Post has text and several Replies.
  • A Reply has text.
The goal of DJ its to be able to tell de model how you want an Author to be filled. You want it just as it is? Ok. Maybe you need it with all its Post loaded but don't want the Replies? Easy.  You want it all loaded? Great!
No need for any extra query for each escenario, no new functions and just one query will be executed on the DB. Also, no extra dependecies.

But how do I tell Mybatis witch relations do I want?
Just an instante of the same entity is used as a filter. Each field that is not null that represent a relationship is loaded.  For example, with the next code an Author with its Post is loaded.




Another example. An Author with its Post and each Posts with its Replies.

No need for new clases or changes. Simple as that.

How do I use it?
I'm still working in a manual and making it a library or if liked, propose a push to Mybatis git. Meanwhile i've made a github repository.

https://github.com/konum/mybatis-dynamicJoin

This repository contains an example project using maven with all the code and a couple of test to show its functionality. The code is release und GNU General Public License.

In the next post I will explain what are the requisites  and changes to be made (just a couple) for this to work with with any entity.

Tuesday 3 February 2015

Project Euler. Math + Code = Fun!

A month ago I discovered the Project Euler, a list of more than 400 math problems to be resolved. Some of them can be resolved just by using maths but others need some clever solution to get the answer. All problems should be computable in less than a second.


You need to register in order to submit your results. Once a problem is resolved, you gain acces to a forum for that problem, where you can share your solution or read other solutions and, on some problems, a PDF with an explanation on the problem. As I have been developing Java for a couple of years I have found very interesting reading other solutions in other languages. In fact, I have started to learn functional programming because of it.


I resolved a bunch of them while studing for the Java 7 Programmer, using concurrency in almost all of them. A bit overkill, but very useful for learning.

Tuesday 20 January 2015

How fast StringBuilder really is and why

All Java developers should know the class StringBuilder for creating strings. What, you don't?  Don't worry. I have found a lot of people developing java that don't.

StringBuilder is a class from de Java API and was introduced in version 1.5. It's name says it all: it is a class for building Strings. It offers a wide range of functions to manipulate the string within that will make your life easier in a heavy string  use application as it can be a J2EE app.  Notice that all functions in StringBuilder are instance functions, so you crate a new StringBuilder and then modify that object.

On of the most used functions of StringBuilder is .append(param). Append just adds the parameter at the end of the string. It has 13 overloaded methods to use (append(int), append(String), append(long), etc...) so take a look at the API. And why it's the most used function? Well, because it's one way to ensure performance while concatenating strings.

How fast it really is?

To answer this question I have written a simple java program that concatenates 65000 strings in three different ways: Method 1 Using + operator on the string, Method 2using String.concat() function and Method 3 using StringBuilder.append() function. Here its the code.


Compile with javac StringConcat.java and run it with java -cp . StringConcat. The output on my laptop is as follows:

Appending 65000 string with different methods... 

Total time +: 3594 milliseconds 
Total time calling concat: 965 milliseconds 
Total time StringBuilder: 1 milliseconds

WOW! The StringBuilder code did the same job in less than 1% of the time that using "+" lasts. This doesn't mean that StringBuilder is going to be always that faster, but you get the point.

But why?

Let's dig a little bit on the bytecode generated by the compiler to understand this difference. Executing  javap - c StrincConcat.class will show us the bytecode generated. In my case it has 209 lines, so for the sake of space and simplicity I will focus on the three for loops. Notice that different compilers can generate different bytecode.

First loop


We can identify the loops with the instructions if_icmpge and goto. The first one would correspond to the for line and will jump to line 61 at the end of the loop. Goto just goes to the line 26.
If you look closely to de bytecode there is a StringBuilder there. So, what's the diference with method 3? Well, there is a new on line 33, so this code it's creating a new StringBuilder instance on every iteration of the loop. Then it appends the current string and after that, appends the string "a". Notice that the default constructor of StringBuilder ensures a 16 char capacity, so over that length the process has to expand the capacity of the StringBuilder. Expanding the capacticy implies allocating a new larger array. Also, the toString() method of of StringBuilder copies his char array to a new array an returns it. Thats creating a total of 3 new arrays each iteration past the 16th iteration.
The compilated code is almost the same as coding this:
That doesn't look very optimal, right?

Second loop


The third loop code is simpler than the first one. It iterates calling String.concat(). Why is faster than method one? Well, you neet to get a loog to String.concat code. It uses arrays to copy the content and creates a new String with the resulting array. The new String(char[]) just stores the reference to the array, so no new array is created. That means around a third of work of method 1.

Third loop


In the third loop the code just calls StringBuilder.append(). What it make it so fast is that the StringBuilder grows by length * 2 + 2 when it's out of capacity for the append operation. That means that it only has to grow about 12 times to be able to store the 65000 chars.

Monday 19 January 2015

Tip of the week: Eclipse breakpoints at exceptions

Have you ever tried to locate and exception being thrown at your code but you can't get there? OR maybe you get the exception's class but not the place wherre is thrown.

Eclipse has a great tool for this matter. Just open up the Breakpoints view (Ctrl + 3 and type Breakpoints)

In the toolbar there is this icon. Click on it.

The exception breakpoint windows give you the chance to tell eclipse to stop at any exception of a type. You can type the class of exception you want.


The two options at the bottom allows you to set if the debbuger should stop on caught exceptions (in a catch block), on uncaught exceptions (useful for those RuntimeExceptions)  or both.

Happy debbuging!

Testing code

Just testing the look of java code on blogger.


https://gist.github.com/ seems good enough for now. Real post soon.

Testing dropbox source download:

Source code