13 KiB
begindiv(intro)
en: tl;dr: en: en: * Tried to make YPassword in jQuery and with Cappuccino. en: * Cappuccino nice in desktop browser but 1.4MB, not compatible with iPhone. en: * jQuery not as nice as the Cappuccino version but 106KB. iPhone compatible. en: * I'll give a try to Dashcode 3.
fr: tlàl: fr: fr: * J'ai essayé de faire une version de YPassword en jQuery et avec Cappuccino. fr: * Cappuccino est très bien sur les navigateurs non mobile mais l'application pèse 1.4Mo et n'est pas compatible avec l'iPhone. fr: * la version jQuery n'est pas aussi jolie que la version réalisée avec Cappuccino mais elle pèse seulement 106Ko et est compatible avec l'iPhone. fr: * J'essayerai Dashcode 3
enddiv
begindiv(intro)
en: Before start, I must say I know Cappuccino and jQuery are no more comparable than Cocoa and the C++ standard library. One is oriented for user interface while the other is and helper for low level programming. en: Nonetheless I used these two to make the same web application. This is why I compare the experience I had with each of them for this specific task. fr: Avant de commencer, je dois dire que je sais que Cappuccino et jQuery ne sont pas plus comparable que Cocoa et la standard library en C++. L'un est fait pour créer des interfaces utilisateurs tandis que l'autre est plus une librairie qui aide aux tâches de bas niveaux. fr: Par contre je les ai utilisé tous les deux pour faire la même application. C'est pourquoi je compare l'expérience que j'ai retenu de chacun pour cette tâche.
enddiv
en: I made a web version of my dashboard widget YPassword. en: It is a simple widget to manage your online password with a strong security and with a totally portable way. It is not intended to replace a keychain. en: It is more a password generator. fr: J'ai fait une version web de mon widget YPassword. fr: C'est un simple widget qui permet d'organiser ses mots de passes simplement avec une grande sécurité et de façon portable. fr: Ce n'est pas un widget créé pour remplacer le trousseau d'accès, mais fr: plus un générateur de mots de passe.
en: The first was made from the code of my dashboard widget and with some jQuery. en: You can try it here. en: I then made a second version with the Cappuccino. You can try it here. fr: Le premier a été élaboré à partir du code de mon widget Mac. fr: Vous pouvez l'essayer ici. fr: J'ai ensuite fait une version avec Cappuccino, que vous pouvez essayer ici.
en: ## What this widget do? fr: ## Que fait ce widget ?
begindiv(intro)
en: If you don't mind about what does my widget and just want to know how the two frameworkcompare, you should go en: directly to the next part. fr: Si vous vous moquez de savoir ce que fait mon widget, vous pouvez allez directement à la section suivante.
enddiv
en: I manage my password on many site with a simple method.
en: I remember a strong master password. And my password is mainly
en: hash(masterPassword+domainName)
fr: J'organise mes mots de passe avec une méthode simple.
fr: Je mémorise un mot de passe maître. Et mon mot de passe est alors (principalement) :
fr: hash(motDePasseMaitre+NomDeDomaine)
en: In reality I need a bit more informations to create a password: fr: En réalité j'ai besoin d'un plus d'informations pour créer mon mot de passe :
en: * A master password, en: * an URL, en: * a maximal password length, en: * the kind of output base64 or hexadecimal, en: * how many times my password could have leaked. fr: * Un mot de passe maître ; fr: * une URL ; fr: * une longeur maximale de mot de passe ; fr: * le type de sortie (hexadécimale ou base64) ; fr: * Combien de fois mon mot de passe a dû être changé.
en: The result password is this: fr: Le mot de passe résultant est calculé comme suit :
domainName=domaine_Name_Of_URL(url)
hash=sha1( masterPassword + leakedTimes + domainName )
if ( kind == 'base64' )
hash=base64(hash)
end
return hash[0..maxlength]
en: In fact depending of websites, some give some strange constraint to your password: fr: En fait, selon le site web, on peut avoir des contraintes très différentes :
en: * minimal length, en: * maximal length, en: * must not contain a special character, en: * must contain a special character, en: * etc... fr: * longueur minimale ; fr: * longueur maximale ; fr: * ne doit pas contenir de caractères spéciaux ; fr: * doit contenir des caractères spéciaux ; fr: * etc...
en: And if you want to change your password the leak number is here for that. en: All informations such as user name, maximal length can be stored in a public file. The only real secret is the master password. fr: Et si vous souhaitez changer votre mot de passe, le nombre de changement sert à ça. fr: Toutes les informations peuvent rester publiques sans trop de danger à l'exception du mot de passe principal.
en: If you want to know even more details you can always look at some of my old blog entries: fr: Si vous souhaitez avoir encore plus de détails vous pouvez toujours lire certaines de mes anciens articles de blog (en anglais) :
Cappuccino
en: First, I'd like to say Cappuccino applications look simply awesome. en: It is like having a Cocoa application in your web browser. en: And this is great. fr: Tout d'abord je voudrais dire que les applications réalisées avec Cappuccino sont tout simplement incroyables. fr: C'est comme avoir une application Mac dans son navigateur.
en: I also must admit I enjoyed making my application with Cappuccino. en: It is like programming for an iPhone application. en: If you are a bit familiar with Cocoa, you feel at home. en: If you don't know anything about Cocoa, I suggest you to look at it. en: This is a really great framework to make User Interface. en: I am not a specialist, but I have done some MFC, java Swing[^1] and WXWindows User Interfaces (some years ago). en: And I must say, Cocoa is far better than those. fr: Je dois aussi admettre que j'ai pris du plaisir a écrire mon application avec Cappuccino. fr: C'est comme programmer une application Mac ou iPhone. fr: Si vous connaissez bien Cocoa, vous vous sentirez comme à la maison. fr: Si vous ne connaissez pas Cocoa, je vous conseille de vous y intéresser. fr: Il s'agit vraiment d'un framework excellent pour faire des interfaces utilisateur. fr: Je ne suis pas un spécialiste de tous les frameworks. fr: Mais j'ai réalisé des Interfaces Utilisateurs avec les MFC, Java Swing[^1] et WXWindows il y a quelques années. fr: Et je dois dire que Cocoa est bien meilleurs que tous ces framework.
en: [^1]: If you are interested you can take a look at SEDiL. I am proud of the tree drawing view made from scratch. fr: [^1]: Si ça vous intéresse vous pouvez jeter un coup d'œil à SEDiL. Je suis assez fier de la vue automatique des arbres que j'ai programmé sans librairie de départ.
en: Cappuccino is a great web application oriented development. en: But there was also some drawbacks fr: Cappuccino est un framework spécialisé dans le développement d'application web vraiment exceptionnel. Mais il a aussi quelques défauts qui ont surgit lors de l'écriture de mon widget.
en: Things I liked: fr: Les choses qui m'ont plu :
en: * It looks great en: * It was fun to program en: * It was like programming a Mac application en: * I could have done the User Interface using Interface Builder. fr: * Le résultat est vraiment très beau fr: * C'était très agréable de programmer fr: * Comme programmer une application Mac fr: * J'aurai pu utiliser Interface Builder pour créer l'interface.
en: Some things I didn't like: fr: Les choses qui ne m'ont pas plu :
en: * I made some time to understand how to handle the onChange on the text fields.
en: * Documentation lacked a bit of organisation.
en: * It doesn't work on iPhone.
en: * It weighted 11MB to deploy.
en: * It weight 1.3MB to load.
fr: * J'ai mis un bon moment avant de comprendre comment récupérer le onChange des champs textuels.
fr: * La documentation manquait d'organisation.
fr: * Ça ne marche pas sous iPhone.
fr: * Il a fallu déployer 11Mo.
fr: * Il faut télécharger 1,3Mo pour que l'application se charge dans le navigateur.
en: I didn't use bindings because I believe they are not ready by now.
fr: Je n'ai pas utilisé les bindings parce qu'il me semble qu'ils ne sont pas prêts.
jQuery
en: The jQuery version of YPassword is not as finished as the Cappuccino one. Because, there is no slider directly with jQuery. I'd have to use jQueryUI. And I believe, using it will make the application weight far more than the today 106KB. fr: La version jQuery de YPassword n'est pas aussi bien finie que celle de Cappuccino. Simplement parce qu'il n'y a pas de slider directement avec jQuery. Il faudrait que j'utilise jQueryUI. Et je pense que l'application deviendrait beaucoup plus lourde pour le coups. En tout cas largement au dessus des 106Ko actuels.
en: To make this version I simply copied my widget source code and adapted it. It was straightforward. But jQuery is not an application oriented framework. It is more a "dark side javascript animation framework"1. fr: J'ai utilisé le code de mon widget mac en l'adaptant un peu pour faire cette version. C'était relativement facile. Mais jQuery n'est pas un framework orienté application. Il s'agit plus d'un framework pour faire des animations qui la pète.
en: I don't have too much to say about the jQuery version. But this was way more low level programming than Cappuccino. fr: Je n'ai pas beaucoup plus à dire sur la version jQuery, sinon que programmer avec jQuery était de la programmation de niveau beaucoup plus bas qu'avec Cappuccino.
en: ## My conclusion fr: ## En conclusion
en: If you want to make an iPhone compatible web application just don't use Cappuccino yet. en: If you want to make simple application like mine, I also believe, Cappuccino is a bit too much. fr: Si vous voulez faire une application compatible iPhone n'utilisez pas Cappuccino. Du moins pas encore. fr: Si vous souhaitez faire un application très simple (comme la mienne), je pense que Cappuccino est un peu trop lourd pour ça.
en: If you want to make a complex web oriented application, Cappuccino is a great choice. en: But you may have some difficulties to begin programming with it. fr: Si vous souhaitez faire des applications web complexes qui ressemblent à des applications de bureau alors clairement Cappuccino est un très bon choix. fr: Notez cependant qu'il peut être un peu difficile de débuter.
en: Finally, to terminate my web version of my widget, I'll give a try to Dashcode 3. en: It seems to be a good alternative to create web widgets. en: I don't know if Dashcode 3 is portable on non webkit browser. en: But if it is, it could be the end of projects like Cappuccino and Sproutcore. fr: Finallement, pour terminer la version web de mon widget, j'essayerai Dashcode 3. fr: Il semblerai que ce soit une bonne alternative pour créer des widget sur le web compatible iPhone. fr: Je ne sais pas si les applications réalisées avec Dashcode 3 sont compatibles pour les browser n'utilisant pas webkit. Mais si c'est le cas, alors ça pourrait sonner le glas des projets comme Cappuccino et Sproutcore.
-
I don't want to feel like a troll I use jQuery to make some dark side animation on this blog. But the javascript on my blog is not needed except for commenting. ↩︎