
Les news web dev pour novembre 2024 - RC 1.0
Durée: 47m27s
Date de sortie: 21/11/2024
Dans ce nouvel épisode, nous allons évoquer le nouveau edge de Bunny, Framer Motion qui devient Motion, PHP 8.4, Docusaurus 3.6, Angular 19, Python qui détrône JavaScript sur GitHub, le débats sur JS0/JSSugar, et le soutien accru pour l’open source par GitHub et Sentry. Retrouvez toutes les notes et les liens de l'épisode sur cette page : https://double-slash.dev/podcasts/news-nov24-1/
Bon, on y va ? Bonjour à tous, bonjour les devs.
J'ai décidé maintenant de dire bonjour les devs parce qu'on est un podcast pour les
développeurs faits par les développeurs.
Donc, bienvenue sur ce nouvel épisode de Double Slash, l'épisode 100.
Donc, on passe à une nouvelle étape.
Et comme d'habitude, nous sommes avec Alex.
Salut Alex.
Salut Patrick, salut tout le monde.
Et bien, ravi de rentrer dans cette nouvelle décennie.
Centenaire on dit, je sais pas que tu vois.
En tout cas, on rentre dans une nouvelle centaine.
Et ça, c'est plutôt cool.
On reprend notre vieille habitude de faire des épisodes de news.
Et on n'avait pas fait de news depuis le mois de novembre, même si le dernier daté
était vraiment sur la fin du mois, c'était la RC3.
Et donc, on arrive sur la RC 1 du mois de novembre avec plein, plein de news.
On va parler de Bunny qui se met sur le Edge Computing.
La librairie d'animation de Motion qui fusionne avec Framer.
On va parler de PHP.
Évidemment, on va parler d'Angular 19.
On va parler de Piton qui revient dans le Game.
On va faire un petit retour aussi sur le DevFest qui a eu Nantes.
On va parler d'Open Source.
On va parler d'IA un petit peu quand même parce qu'on est obligé.
Et on va parler de IKEA qui a refait son site avec une techno qui a l'air plutôt pas mal.
Et on va regarder ça.
On attaque.
Oui, on peut remercier nos sponsors.
Évidemment, comme d'habitude, on remercie toutes les personnes qui soutiennent le podcast
via le sponsoring.
Donc, c'est accessible sur le site dans la rubrique NousSoutenir.
Donc, merci à tous les sponsors.
Ils sont ils sont dix, je crois, si je ne me trompe pas.
Merci à vous. Merci. Merci à vous.
Merci à vous.
Allez, allez-go.
Allez, on attaque avec Bunny qui en fait se lance dans le Edge Computing, le Edge Scripting.
Alors, pour ceux qui ne connaissent pas Bunny, initialement, en fait, c'est un CDN
qui est basé en Europe de l'Est.
Et ils ont plutôt des prix très agressifs.
Ils sont hyper compétitifs.
Donc, on va pouvoir, en fait, stocker du contenu et le délivrer.
Ils ont toute une architecture sur toute la planète avec des réplicats ou ça va gérer, en fait,
toute la distribution du contenu.
Ils sont passés sur de la vidéo aussi.
Ils viennent tout le temps rajouter des nouvelles fonctionnalités.
Et aujourd'hui, en fait, ils viennent d'introduire ce concept de Edge,
c'est-à-dire d'exécuter du JavaScript au plus près de l'utilisateur.
Alors, tous ceux qui utilisent Versel ou Netlify ont déjà ce système-là
en place depuis longtemps.
Mais eux, en fait, ils viennent capitaliser sur leur infrastructure
pour exécuter ce bout de code JS,
potentiellement sur des workers qui se trouvent au plus près de l'utilisateur.
Alors, on est encore loin de l'ADX, on va dire,
qu'on peut avoir sur, par exemple, un Next ou un Nuxt,
où tu fais un Versel deploy ou des choses comme ça.
Voilà, ils ont leur propre SDK.
Mais potentiellement, moi, je reste un petit peu convaincu
que demain, Next ou Nuxt, où des gros acteurs vont écrire des presets
pour qu'on puisse déployer directement sur cette nouvelle opérateur.
Et donc, ça, c'est plutôt bien.
Et en plus, avec des pricing toujours assez agressifs.
Réduquent, quoi, les prix.
Ah non, c'est vraiment hallucinant.
On peut dire quand même que...
T'étais dessus, c'était 2 millions de requêtes pour, je sais plus quoi,
0,2 centimes, je sais pas.
Ouais, c'est quasiment les mêmes prix que Claude Flair.
Je sais pas si tu te rappelles, mais Claude Flair, à cet arrive-là,
c'est, je crois que c'est 20 centimes, la million d'exécutions de requêtes.
Et un peu aussi du CPU.
Mais on est très, très, très, très, très bas en termes de tarifs.
Bon, je n'arrive pas à le retrouver pour le montrer exactement.
Mais c'est délivré par Deno.
Donc le run-time, en fait, c'est Deno.
En fait, ce qui dit, c'est au-dessus, c'est les fonctions qui tournent au-dessus de Deno.
Donc la base du truc, c'est Deno.
Donc et surtout, c'est hyper simple à mettre en place.
S'il y a quelques exemples dans la page, c'est ultra, ultra simple.
Il n'y a pas de...
Ouais.
Le seul truc que je vois, c'est que je suis obligé d'utiliser leur propre SDK.
Tu vois, en fait, j'ai leur SDK qui vient frapper mon truc à moi.
Et en fait, ça, ce n'est pas super facile.
En tout cas, je ne trouve pas ça en termes de développeur expérience.
Ce n'est peut-être pas le plus ultimum.
Par contre, ce qui est sûr, c'est qu'il vienne un peu de challenger le truc.
Demain, ça va évoluer.
Et les frameworks, en fait, vont écrire leurs presets.
Je suis quasiment sûr et certain que les mecs de Nuxt,
en fait, qui ont déjà fait leurs presets pour Nitro, tu vois,
où je pense à des frameworks type Onno,
qui se veulent un petit peu les successeurs de Express.
Pour le coup, je suis quasiment sûr qu'ils vont développer leurs propres presets.
Et voilà, tu feras un preset spécifique.
Et ça sera directement injecté sur cette plateforme.
Donc, un nouvel, on va dire, un nouveau provider qui rentre sur le Edge Computing.
Et ça, c'est plutôt toujours une bonne nouvelle.
Parce que plus il y a d'acteurs et plus ça se tire la bourre,
et plus au milieu, nous, les devs, on s'en sort.
Donc, c'est bien.
Oui.
Beny, en fait, comme tu l'as dit, c'est un équivalent de Cloudflare.
C'est vraiment concurrent direct d'Europe de l'Est avec des tarifs hyper agressifs.
Notamment, je crois, tout ce qui est vidéo streaming, tout ça, ils sont vraiment.
Ouais, ceux qui connaissent pas, aller jeter un coup d'œil à Beny, c'est intéressant.
Ouais, exactement.
News suivante.
Yeah.
Framer.
Exactement Framer.
Framer.
Framer, Framer motion, en fait, qui était une librairie indépendante d'animation,
mais qui était maintenue quasiment par Matt Perry.
Et il avait fait une autre librairie qui s'appelait motion,
qui, elle, était se voulait un petit peu plus agnostique en JavaScript pure.
Et là, ils fusionnent les deux projets.
Et pour le coup, je pense qu'en termes de maintenance,
ça doit être beaucoup plus facile pour lui.
Donc, ouais, pour le coup, c'est quand même pas mal.
Donc il a fait tout un article.
Et pour le coup, je crois que sur le site de Double Slash,
on utilise cette librairie là, je crois.
Oui, ouais, ouais, on a motion.
D'ailleurs, j'ai mis à jour, il n'y a pas longtemps.
J'ai mis à jour le dépendance.
Ça n'a rien cassé.
C'était une version qui était majeure, mais ça n'a rien cassé.
Donc, ça va, on a bien bossé.
C'est cool.
Et pour le coup, motion, en fait,
se veut un peu le successeur de JSAP.
En termes de poids, il est beaucoup plus léger.
Il est aussi rapide.
Il y a quasiment, en fait,
99%, on va dire, des API de JSAP, en fait,
sont recodés dans motion.
Donc, on peut faire du staging, des timelines, des choses comme ça,
des choses vraiment complexes.
En fait, on va pouvoir le faire directement avec motion.
Et on a un SDK JavaScript pur.
Et il a fait un JavaScript, un SDK spécial pour React aussi.
Mais surtout, ça se...
Ça se implique super facilement dans des applications React, tout ça.
Parce qu'on voit l'exemple, c'est motion.dev, ça te fait un div.
Et après, tu as des directives, des animais, tout ça.
Et c'est hyper simple.
Tu as juste à frapper des éléments, et après, ils se mettent en animation.
Pour l'avoir déjà utilisé, c'est hyper simple de faire des animations.
Des simples animations dans les applications.
C'est top.
Complait. Et pour le coup, tu vois, quand on avait fait le site de Double Slash,
que t'as mis à jour, et on vous invite à aller voir
les nouvelles modifications que Patrick a faites, c'est vachement classe.
Maintenant, on a toutes les pochettes, tout. C'est vraiment stylé.
Pour le coup, en fait, le gros avantage que je voyais, c'est que...
En fait, c'est totalement agnostique.
Et à l'époque, il avait fait une librairie avec vue.
Et en fait, c'était vachement plus complexe que le faire en JavaScript pure.
Et donc, j'étais resté sur la partie JavaScript,
parce que c'était mais ultra simple à utiliser.
C'est pas du tout verbeux, et tu comprends ce que tu dois faire, tout.
C'est vraiment bien fait.
La doc est hyper bien faite, hyper structurée.
On comprend tout de suite ce qu'on a à faire.
Et on peut utiliser, il y a des exemples.
Et c'est assez facile à mettre en place.
Donc, si vous avez un projet d'animation,
un truc léger, Motion, c'est vraiment pas mal.
C'est vraiment pas mal.
Oui, c'est vrai.
Après, Jéza reste vraiment pas mal aussi, mais Motion,
pour être un peu plus light et tout, c'est pas mal.
Mise à jour de PHP !
PHP qui passe en 8.4.
Super news ultra fraîche.
Clairement, qu'est-ce que...
On est le 21, et c'est aujourd'hui en fait.
Donc, on peut pas faire plus frais.
Qu'est-ce que ça amène de news à savoir que...
J'ai voulu pas trop dans l'univers PHP.
Je sais pas trop qu'est-ce qui est vraiment du gros breaking change,
un gros truc de ouf, ou alors, c'est juste une évolution classique.
Il y a de la fonctionnalité vraiment intéressante.
Après, il y en a plusieurs, mais deux notables,
c'est les proporties OUX, qui sont sur l'écran, qui te permettent...
Alors, les guétaires, les setters, existaient déjà au niveau des classes PHP,
mais là, on a carrément...
Dans une propriété, avant d'entendre une valeur de la classe,
on peut maintenant mettre un guet et un set
pour modifier la valeur retournée ou insérer.
C'est quelque chose qui n'était pas disponible.
C'est quelque chose qu'on a déjà,
j'avais écrit tout ça, mais voilà.
C'est pas mal de pouvoir modifier à la volée une valeur quand elle est insérée,
directement.
C'est cool.
Ensuite, on a une nouvelle fonction qui s'appelle ArrayFind,
qui permet, comme dans JS, de trouver le premier élément qui correspond à la recherche.
Ah ouais, il n'y avait pas ça.
Il n'y avait pas ça.
Il y avait d'autres fonctions, mais...
Petit à petit, il y a le map qui arrive, il n'y a pas de super longtemps aussi.
C'est intéressant parce que tu vois, c'est ce qu'on a déjà dans JS,
dans d'autres langages qui sont implémentés.
Il y a des façons de le faire, enfin, on pouvait déjà le faire,
mais d'une façon, là, c'est plus simple.
OK.
Par contre, là, je vois, c'est marqué en RCF.
C'est officiel ou c'est encore derrière un flag ou derrière quelque chose ?
Bonne question.
OK.
Posing call.
OK.
Normalement, c'était officiel, ça sort dans la 8-4, alors peut-être il y aura des améliorations par la suite,
mais normalement, c'est officiel.
OK.
Dac.
Nice.
Nice.
Très, très nice.
Et de toute façon, on mettra évidemment tous les liens qu'on montre à l'écran.
On les met directement dans les notes de l'épisode.
Et vous pouvez aussi aller sur le site www.doubleslash.com et vous retrouvez tout développé.
Docusaurus, qui est maintenu par notre collègue Sébastien Lorbet, qui est venu sur www.doubleslash,
nous présentait justement cette solution de création de documentation.
Là, grosse mise à jour, il passe en 3.6 et j'ai vu des benchmarks apparemment, c'est beaucoup, beaucoup, beaucoup plus rapide.
Ouais, ils ont mis à jour tout le tout ligne de compilation.
Ils sont passés sur RSPAC, SWEC, le compilateur ProReact, Lightning CSS,
et donc compilation ultra rapide par rapport à l'avant, déjà.
Gros gain de compilation.
Et après, il y a certains sites, alors d'après les stats qu'ils ont,
certains sites qui ont deux à quatre fois plus vite.
Bon, c'est beaucoup.
C'est beaucoup.
Il y a vraiment une grosse différence, une grosse impact sur cette version.
Les sites sont beaucoup plus rapides.
C'est beaucoup plus rapide à compilé.
Donc on le gagne dans tous les sens.
Nice, excellent, excellent.
Ouais.
Allez, on enchaîne Angular 19.
Il n'était pas déjà sorti Angular 19, où c'était où c'était en fait la preview.
Alors c'était la 18 qui est au point.
Bon, bah, ouais, ouais, c'était la 18, la 19 sort là maintenant.
Bah, ils annoncent le 20, je crois.
Enfin, il était hier, je crois, l'officiel, je crois.
D'accord.
Donc 19 qui continue son évolution.
Donc il y a beaucoup d'évolutions dans ce genre.
J'en ai noté quelques-unes, mais il y a pas mal de nouveautés.
Mais la première, c'est l'hydratation incrementale.
Ouais.
Ouais, derrière.
Alors ils ont un système dans les templates qui s'appelle At Defer, là,
qui permet de déférer en fait l'hydratation de certains éléments.
Pour faire court, c'est comme le Island Component.
Voilà.
Voilà.
Ce qu'on avait sur...
Comment il s'appelle le framework JS là,
quand tu cliques, en fait, ça va charger le JS.
J'ai un trou de misco...
Quik, il ne le voit pas.
Quik, voilà.
Quik, c'est le principe de Quik où tu as des éléments qui sont affichés,
mais tant que tu n'as pas mis la souris dessus ou un truc comme ça,
il ne va pas charger le JS qui fait fonctionner.
Voilà, c'est un peu le même principe.
C'est-à-dire que les éléments sont affichés à l'écran,
mais tant que tu n'as pas interagé avec eux ou quoi que ce soit,
il ne s'est pas hydraté, en fait.
Ouais.
On gagne de vitesse parce que le JS qui correspond à chaque bloc n'est pas chargé
et c'est hydraté à la demande.
Enfin, voilà, il y a différents modes d'hydratation,
mais pas mal d'hydratation incrementale.
Donc ça, c'est bien.
Toujours un gain de performance.
Et est-ce qu'on n'est pas en train de voir un peu, tu vois,
le côté serveur component qui est en train de se démocratiser.
Alors il l'appelle sous différents noms,
mais au final, c'est le même concept un peu adapté à tous les frameworks.
Voilà, on va faire du serveur side rendering sur des composants
et on va les appeler à la volée.
C'est un peu ça.
Ouais, c'est tout ça.
Un peu même principe, ils ont toujours à peu près les mêmes concepts.
Après, c'est des noms différents, c'est ça.
Tout à fait.
Et par contre, ce que je vois,
c'est que sur le lien qu'on a mis là où ils expliquent,
c'est en français.
Donc pour...
C'est le angular.fr.
Et donc pour... voilà, souvent, ça peut arriver,
quand on ne comprenne pas toujours l'anglais,
mais là, pour le coup, c'est assez rare pour le notifier
que toutes les explications sont faites en français.
Donc il n'y a plus d'explications.
Je crois que c'est une communauté française.
qui traduit, il me semble, angular.fr.
Je ne dis pas de bêtises, mais voilà.
Donc moi, mais c'est cool.
Ils ont été super actifs, c'est déjà dispo et tout.
Donc c'est cool.
On revoient à eux.
Standalone, en fait, depuis quelques temps,
on peut faire des... générer des compagnons standalone.
C'est des compagnons beaucoup plus simples qui ressemblent
à tout ce qu'on fait sur React, tout ça.
C'est des compagnons...
Avant, on était obligés de faire des modules, tout ça.
Enfin, voilà, je ne suis pas un spécialiste angular,
mais avant, c'était compliqué.
Il voulait faire un component, il fallait faire un module,
un module, il y avait plein de fichiers qui étaient générés.
Depuis quelques temps, mode standalone qui est plus simple,
il a juste un component.
Et maintenant, c'est par défaut.
Parce que jusqu'à la 18, il fallait mettre standalone true,
un truc comme ça, dans les lignes de commande.
Maintenant, c'est par défaut.
Donc on simplifie les choses.
Toujours plus... voilà.
Angular se simplifie de plus en plus.
Ça, c'est cool.
Ils ont un système aussi de migration pour les signaux.
Donc ils ont intégré les signaux, tout ce qui est signal, en fait,
au niveau d'angular pour virer zone.js qui était trop lourd.
Et voilà.
Donc maintenant, les signaux sont intégrés.
Et donc pour ceux qui veulent migrer les applications vers les signaux,
il y a un système de migration automatique où tu vas taper.
Ça va te changer les components.
Donc ça, c'est cool.
Il faut noter qu'angulards souvent
a des outils de migration qui sont assez pratiques pour passer les versions.
Donc ça, c'est cool.
Voilà.
Passer sur les signaux pour une application plus réactive.
Peut-être aussi que...
Et peut-être qu'ils ont appris aussi
la communauté où en tout cas les créateurs ont
entendu la souffrance qu'il y avait eu
de la version 1 à la version 2 où ils avaient...
En fait, ils s'étaient vraiment tirés une balle dans le pied.
Et donc maintenant, c'est devenu dans leur corps et dans leur ADN
de faire quelque chose qui est évolutif
et où la migration ne se fait pas dans la douleur et dans la souffrance.
Donc, important.
Oui, mais ça, ils ont toujours proposé ces outils de migration.
C'est vraiment un point fort d'angular.
Dernière chose, après, il y en a plein, mais voilà.
Le rendu hybride d'angular, donc c'est un...
T'es en plein dessus.
C'est de pouvoir choisir pour les routes différents modes,
soit un mode pré-render, un mode serveur, un mode client,
ce qu'on retrouve évidemment dans d'autres frameworks.
Mais voilà, c'est dispo.
Voilà, ça se paramètre et tu peux dire,
cette route-là sera pré-rendue, etc.
Donc, rendu hybride dans Angular 19.
Donc, on voit que Angular progresse,
se simplifie et prend un petit peu dans les autres frameworks
que ce qui existe et l'applique chez eux.
Donc, super Angular.
C'est méga propre.
Et de toute façon, les trois se tirent la bourre.
On le dit toujours, mais c'est vraiment...
Et là, on le voit bien, quoi, que les trois frameworks majeurs
se tirent la bourre pour faire de la qualité
et tendent vers la même chose.
Donc, c'est plutôt sympa.
On parle beaucoup de JavaScript, c'est vrai.
Mais sur la conférence de GitHub,
il y a eu un petit point en disant
qu'apparemment, Python...
Il y a de plus en plus de projets Python sur GitHub.
Je crois que l'IA en est pour quelque chose.
Et donc, il y aurait plus de projets
sur Python que sur JavaScript.
Oui.
Rapport octobers 2024, Python surpass JavaScript.
Voilà.
En tant que langage le plus utilisé sur GitHub.
Merci, Lila.
En fait, clairement, pour faire un peu d'IA en ce moment,
tout ça, de code Python, en fait, t'es obligé de faire du Python.
L'IA, c'est tout ce code en Python.
Il y a plusieurs frameworks, etc.
Donc, t'es obligé de faire du Python.
Python devient surpass JavaScript.
C'est assez étonnant, parce que, vu la quantité de projets JavaScript
qui existent sur GitHub, tu te dis, voilà.
Mais Python revient en force devant, grâce à l'IA.
C'est vraiment une croissance de l'IA sur GitHub,
ce qu'ils indiquent dans le rapport.
Projet IA generatif ont augmenté de 59 %,
une hausse de 98 % du nombre de projets.
C'est vraiment une adoption rapide de l'IA par les développeurs.
Donc, voilà.
Beaucoup de personnes se mettent à l'IA et développent des petits trucs.
Et ils notent aussi une expansion mondiale des développeurs.
Donc, ils disent que ça considérablement augmentait le nombre de développeurs.
Quoi qu'on en dise, l'IA doit nous remplacer, etc.
Mais en tout cas, il y a toujours plus en plus de développeurs.
Et notamment en Inde, ils disent, au Brésilie, au Nigeria.
Et surtout, ils indiquent que l'Inde est en passe de devenir la plus grande communauté de développeurs
sur GitHub, ici, 2028.
Oui, finalement.
Moi, ça ne me surprend pas.
Oui, clairement.
Donc, ce n'est pas l'IA qui vient de nous remplacer, c'est l'Inde.
Et pour le coup, est-ce que ces développeurs, en fait,
doivent faire du JavaScript comme aujourd'hui?
Où est-ce qu'on est en train de voir un espèce de schisme
qui est en train d'apparaître au sein de JavaScript?
Et il y a des personnes dont Google appelle des grands noms de la tech.
Qui œuvrent pour splitter le JavaScript en deux langages.
C'est quoi cette proposition-là?
C'est dans la réunion de standardisation de la TTC 39.
Ils ont proposé, en fait, un ingénieur de Google qui a proposé de 5D en deux JavaScript.
En deux langages, ils disent ça.
Donc, ça a donné des vives discussions sur Acurnews.
Et forcément, beaucoup de gens ne sont pas d'accord.
Ils sont d'accord.
Chaqu'un se donne ses arguments comme d'hab.
Donc, l'idée, c'est de faire un JS0.
En gros, il l'appellera comme ça.
C'est une sorte de noyau JavaScript qui serait implémentée dans les moteurs.
Tout ce qui est navigateur, etc.
Et qui serait simplifié.
Ce serait la base du langage pour que ce soit performant, tout ça à sécuriser.
Et ensuite, l'idée, c'est de faire un JS-sugar.
Alors, les noms, c'est juste pour proposer quelque chose.
C'est des noms de code.
Oui, c'est pas défaite.
Et ça se trouve, ça se fera jamais aussi.
Donc, il serait une version enrichie et qui serait obligée de passer par des compilateurs
pour se retrouver en version JS0.
Donc, tu aurais une version JS que tu vas compiler pour que ce soit en JS0.
C'est un peu bizarre.
Finalement, c'est un peu ce qu'on a aujourd'hui avec TypeScript,
qu'on va compiler pour que ce soit déjà un JavaScript.
C'est pas loin, en tout cas.
Donc, l'idée, c'est ça pour éviter d'avoir pleine fonctionnalité inutile
dans le moteur de base.
Bon, je sais pas trop ce que ça va donner.
Après, est-ce que, en fait, comme tu l'as déjà dit,
c'est déjà un peu le cas.
Et moi, ce que je vois surtout, c'est qu'on va vers une complicification.
Et c'est déjà de plus en plus compliqué.
On se rend compte que chaque framework vient rajouter des couches et des couches
et des couches et ça devient de plus en plus compliqué.
Et le fait d'avoir deux langages, tu vois, est-ce que ça serait pas encore
une version encore plus compliquée ?
Je sais pas.
J'ai l'impression que la tendance, ça serait quand même
essayer de tendre vers une sorte de simplification.
Et là, en fait, ça ne prend pas trop le chemin.
Donc, je sais pas.
Oui, je trouve que ça compliquerait encore les choses
pour un nouvel arrivant, comprendre qu'il y a deux versions, etc.
Et il souligne aussi que ça donnerait une dépendance aux outils de compilation.
Ce qui n'est pas forcément très bon.
Alors qu'on a plutôt tendance aujourd'hui à dire,
essayer de faire sans compilation, tout ça.
Donc, je sais pas trop.
Moi, je sais pas trop.
Je sais pas quoi.
Je sais pas, David, là-dessus.
Après, pourquoi pas, mais c'est bizarre.
Ceptique, quoi.
De toute façon, pour l'instant, avant que ça arrive officiel,
il y aura du chemin entre...
Ouais, moi, je trouve que...
C'est une idée, quoi.
Oui, JS est compliqué, oui, c'est compliqué, oui.
Mais se simplifier aussi, comme par exemple l'idée d'intégrer des signaux
natifs dans JS, par exemple, tu vois, ça simplifierait pas mal de choses.
Parce que les signaux sont dans plein de frameworks.
Imaginons que demain, si c'est intégré en natif,
les frameworks utiliseraient le système natif.
Donc, ça allait gérer les frameworks.
Donc, pourquoi ?
Voilà, ça se complique, ça se simplifie d'un autre côté aussi.
Donc, ouais, c'est diviser ça en deux, c'est un peu chelou, quoi.
Ouais.
En tout cas, je connais pas de langage divisé en deux versions.
Non.
Enfin, je connais pas tous les langages du monde, mais je vois pas un langage, tu vois, PHP,
en version simple et en version compliquée, je sais pas.
C'est un peu bizarre l'idée.
Pour le coup, pour Ria Hetzati, elle n'a pas attendu le chisme du langage JavaScript
pour sortir du JavaScript et en fait, elle a migré son Next.js en HTML, HTMLX, en fait.
Et donc, elle a réduit...
Un mec.
Un mec.
Ah ouais !
Pour Ria Hetzati.
Oh merde, j'étais persuadé que c'était...
Ah mais c'est pas grave.
Toutes mes excuses.
Je l'ai dit ça parce que j'ai regardé la vidéo, j'ai entendu ça vous, c'est pour ça.
Sinon, j'aurais pu faire la même erreur.
Ah ouais, j'étais persuadé.
Bon, ma faute.
Mais pour le coup, en fait, migration transformée Next.js et le recoder avec du HTMLX directement,
c'est quoi surtout le gain de cette opération, en fait ?
Alors, pour Ria, il développe un URL shortener qui est pas mal d'ailleurs,
que tu peux auto-hyberger et tout ça.
Donc, c'est déjà le truc qui est pas mal.
Je ne connais pas, je l'ai découvert.
Là, en fait, l'article, c'est une expérience, une réelle expérience sur comment migrer,
simplifier les choses.
Et en bas, en fait, il explique dans sa vidéo comment, ce qu'il a fait, etc.
Il était sur Next.js et la version...
Il maintenait le truc.
Donc, c'est une Next.js dans les dernières versions, tu vois.
C'est pas un truc qui a spuisant, qui n'a pas bougé.
Donc, vraiment, une grosse maintenance.
Et pour résumer, en fait, il a réduit les dépendances de 87%.
Il est passé de 24 dépendances à 3.
Ça, c'est énorme.
Il écrit moins de code, parce qu'il écrit quand même encore beaucoup de code,
parce qu'il est passé sur un moteur de template.
Je crois que c'est Handelbar.
Enfin, voilà.
Donc, il n'y a plus de Next, mais il y a quand même des Handelbar d'un côté
pour faire l'HTML, l'HTMX, tout ça.
Il a réduit, alors ça, c'est marrant, le temps de compilation de 100%,
puisqu'en fait, il n'y a plus de compilation.
100% de gain.
Oui, plus de compilation.
Et surtout, le website a réduit de 800...
Il était à 800K et il est passé à 100KB.
Donc, gros gain, en fait.
Voilà, gros gain dans tous les sens, en fait.
Et il marche de la même façon, en fait.
Voilà, c'est ce qu'il explique dans la vidéo.
Donc, intéressant.
Et je crois que maintenant...
Ah oui, je crois qu'à un moment, je vais regarder la vidéo.
Il fait voir aussi que ça fonctionne aussi sans JavaScript.
Le truc.
Donc, voilà.
Enfin, voilà.
Donc, il a gagné de tous les côtés.
Et voilà, après, ça représente quand même un énorme boulot,
de passer d'une application Next.js à un truc plus simple en HTMLX.
Mais c'est la version 3, si vous allez sur le GitHub.
La version actuelle, quand t'arrives, c'est toujours...
En Next, il faut aller sur la version 3,
qui n'est pas encore officiellement sorti, je crois,
pour voir la version HTMLX et pouvoir explorer le code, tout ça.
Mais...
Sur la version 3 de son logiciel à lui.
C'est ça?
Oui, oui, oui.
Mais dans tous les cas, voilà, c'est super intéressant.
Et puis, même, l'URL Shortner, là, il est cool.
On peut l'utiliser.
Il y a le GitHub.
Tu peux l'installer chez toi et tout.
Pas mal aussi.
Nice.
Allez, on va passer dans l'univers un petit peu plus design
et un petit peu plus joli des CSS Clamp.
Alors, pour ceux qui ne connaissent pas
ou qui n'ont jamais utilisé la propriété CSS Clamp,
comment tu pourrais définir ça, Patrick?
Là, je te prends un peu à la gorge.
Je suis désolé, mais...
Ah non, non, je l'utilise depuis un moment,
mais c'est une propriété qui est dure à comprendre.
D'office, tu vois, tu me dis,
j'ai mis du temps à comprendre comment ça fonctionne.
Je comprends pas.
En plus, des fois, tu as des calculs et tout.
Tu as divisé par, je sais pas quoi, 2%, machin.
Clamp, en fait, il y a 3 valeurs.
C'est une propriété CSS qui est native,
qui, à la première, c'est minimum.
Au milieu, c'est la taille que tu veux préférer, en gros.
Et la dernière, c'est la maximum.
Et en fait, par exemple, pour une taille de fonte,
ça va se réduire tout seul.
Ça va être de la plus grosse à la plus petite.
Et si tu fais bien les choses avec le calcul central,
c'est là où on rentre dans les calculs.
En fait, avec la taille du device,
ça va réduire, en fait, automatiquement, la taille de la police.
Donc, c'est de plus en plus d'utiliser.
Et voilà.
Et donc, ce plugin, Daywind,
permet d'utiliser la propriété clamp.
En fait, ça va générer des clamps à la volée avec un...
Donc, tu utilises le Tilde.
Donc, ça s'appelle comme ça, le petit...
La petite vague.
La petite vague qu'on a sur le clavier, c'est le Tilde.
On le met juste avant.
Donc, PX, tiré 4 slash 8.
Et donc, la minimum, ça sera 4 et le maximum 8.
Et après, il va faire le calcul entre les deux pour que ça s'adapte.
Top.
C'est...
L'idée, en fait, c'est...
Ouais.
L'idée, c'est de faire du CSS sans breakpoint.
Donc, faire du responsive sans breakpoint.
Et grâce à Clampe, en fait, de gérer tous ces systèmes de marge,
de taille de texte, etc.
Donc, l'idée, en fait, c'est de supprimer les médiacueries, en fait.
C'est ça.
OK.
D'utiliser au minimum.
C'est vrai qu'après, c'est un jeu intéressant.
Moi, j'essaie de le faire un petit peu.
C'est pas forcément facile.
Mais on y arrive à peu près avec tout ce qui est flex et gris de tout ça,
de se passer des médiacueries avec des systèmes qui vont passer à la ligne
automatiquement, etc.
Dès que tu arrives à une certaine taille.
Donc, mixer avec les Clampe et tout ça, tu arrives à faire quand même
quelque chose de correct, sans médiocurie.
On arrive à dégager les médias et...
Ouais.
Après, là, je pense que, comme dans...
Comme dans Taiwan, souvent, en fait, il faut bien maîtriser ton CSS
pour bien maîtriser Telwing.
Sinon, ça sert à rien, en fait.
Tu ne sais pas faire.
Donc, il faut déjà que tu connaisses ton CSS.
Et après, tu apprends à le faire avec Telwing.
Là, c'est exactement pareil.
Là, on voit, c'est un exemple avancé, j'en conviens.
Mais là, on est sur des breakpoints avec des fluides.
Là, ça commence un peu à piquer les yeux.
Tu as vague md slash lg2.
Là, tu as intérêt à vraiment bien connaître.
Par contre, effectivement, tu vas pouvoir en fait
faire des choses hyper stylées sur la taille de ton texte
qui va s'adapter automatiquement.
C'est hyper puissant.
Par contre, je pense qu'il faut vraiment gérer les CSS Clampe
déjà nativement, de bien comprendre avant de l'intégrer
dans ton Tywin, sinon tu risques de pleurer un peu quand même.
Ouais, c'est clair.
De toute façon, il faut connaître le CSS.
De toute façon, pour utiliser correctement Tywin, il faut connaître le CSS.
J'espère qu'il n'y a pas des personnes qui ont directement commencé avec Tywin
et qui n'ont jamais écrit de CSS parce que là, c'est un peu grave.
Ça va être compliqué pour eux.
De toute façon, à un moment donné, ils seront limités.
Et justement, en parlant de limitation, la librairie qu'on présente là,
mais clairement déjà des limitations et on voit des exemples très clairs où ils
montrent que parfois, ça ne pourra pas marcher si on utilise des propriétés
type calque ou des choses comme ça.
On pourra souligner quand même la qualité visuelle du site.
C'est quand même super bien fait.
Il est super classe.
Il est fortement inspiré de Telwin CSS.
Le site, on va dire, original, il reprend un peu tous les codes.
C'est super clair, c'est super explicit.
Les exemples sont très bien.
Et en plus, la librairie qu'il propose est ultra puissante.
Ouais, donc c'est Fluid Tywin, je crois, ça s'appelle.
Exactement. Fluid Tywin.
Et une petite installation et c'est parti.
Allez, on bascule la Nantes sur le Dev Festival,
le Dev Fest Nantes 2024 qui a eu lieu le 17 et le 18 octobre.
On a des photos, on a des vidéos de tous les speakers.
Il y avait juste pas combien de speakers.
Il y a pas mal de campérents.
Beaucoup de monde.
Est-ce que tout a été filmé et tout est disponible?
Bonne question.
Je crois que oui, tout est disponible sur YouTube.
En tout cas, il y a pas mal de vidéos sur YouTube.
J'en ai regardé quelques-unes.
J'en ai encore d'autres à regarder que j'ai eu le temps.
Mais Dev Fest, c'est super simple.
Moi, j'adore la déco chaque année.
Ils font des déco super sympas.
Ça, c'était les zombies.
Avec comment ça s'appelle?
La fête.
J'ai des troncs.
Halloween.
Halloween, oui.
C'était sur le thème d'Halloween.
Donc, il y avait des trucs avec des zombies, machins, du sang.
C'était cool.
L'année dernière, ils avaient fait un truc aussi dans ce style.
Je sais plus que c'était la déco.
Mais chaque année, ils font des supers décos.
Même sur scène, tout est adapté.
C'est vraiment chouette.
Puis, il y a souvent des bonnes conférences.
Et donc, sur YouTube, il y a tout qui est disponible.
Moi, j'en ai noté quatre, mais il y en a encore d'autres aussi.
Vous pouvez regarder.
Très intéressantes.
Donc, la première, c'était avec Christophe Fortneuve, qui fait une confe sur ES 2020.
Donc, quoi de neuf dans ES 2020?
Donc, conférence intéressante, si vous êtes Dev Javascript,
parce qu'il explique un peu ce qui arrive, ce qui est arrivé, etc.
Ce qui est en draft et tout ça.
C'est vraiment intéressant.
De toute façon, toujours intéressante, les confes de Christophe Fortneuve.
Il y en a une où ils sont deux.
Il parle du React compiler.
Donc, voilà comment il fonctionne, comment, pourquoi ils l'ont créé, etc.
Donc, intéressant aussi, si vous faites du React.
Ensuite, on a Adam Hargill.
Je pense que c'est comme ça son nom.
On le prononce, ce mec qui bosse chez Google, encore, il me semble.
Qui fait une confe, donc, il est américain.
Qui fait une confe, amazing CSS in 2020.
Donc, voilà.
Intéressant sur tout ce qui est CSS.
Donc, je n'ai pas regardé encore celle-là, mais il doit certainement parler beaucoup
de Scroll Animation, tout ça.
Qui est aussi une confe que j'ai commencé à regarder, mais que je n'ai pas fini.
C'est Serverside, Wasm.
Donc, comment refaire un sort de backend avec Wasm dans le client, etc.
Comment ça fonctionne, comment Wasm fonctionne, comment tu interagis avec lui, tout ça.
Donc, voilà.
Mais après, il y en a plein d'autres, hyper intéressantes aussi.
Nice.
Encore plein de vidéos à regarder sur les tendances, les évolutions,
sur la techno qui évolue.
Je mets assez de temps pour regarder toutes les vidéos qui sortent, non tellement de vidéos.
On est d'accord.
On est complètement d'accord là-dessus.
Allez, comment on peut aller récupérer de la tune pour aller sécuriser l'open source ?
Bah écoute, ça fait plaisir parce qu'on avait parlé du open source pledge, je crois.
C'est ça comme ça.
Oui, c'est ça ce pledge.
On voit que finalement, on s'est en train de bouger en ce moment pour l'open source.
On a parlé beaucoup des personnes qui contribuent à l'open source, qui avaient des projets à maintenir,
tout ça, qui n'y gagnaient pas leur vie, etc.
Et on voit que depuis quelques mois, ça bouge, donc l'open source pledge.
GitHub se lance dans la course aussi avec un GitHub open source fund.
Pareil, qui va chercher des sous pour le redistribuer à des projets open source, à des mainteneurs, tout ça.
Donc ça bouge.
C'est tout frais 19 novembre, ça vient d'arriver.
Donc bonne nouvelle pour les mainteneurs.
Maintenant, on peut se lancer dans un projet open source,
c'est éventuellement être soutenu par ces fonds d'investissement, on va dire, en quelque sorte.
Donc cool.
Donc voilà.
Compliqué par contre, il faut que ton projet soit suffisamment solide, qui sort.
Oui, justement, les candidatures sont ouvertes jusqu'au 7 janvier.
C'est bien d'ailleurs mon gros.
Ok.
2025 et financement et programme débutant en début 2025.
Donc tu peux déposer.
Si vous avez un projet open source qui mérite peut-être d'être financé par GitHub fund,
déposer une candidature et peut-être que ça sera accepté.
Excellent.
Après évidemment, il y a certainement différents niveaux de contribution.
Cool.
Et on va dire, dans le même esprit, c'est centri qui est un outil qui va nous permettre de tracer un peu tous les bugs
et faire du tracing, de l'erreur monitoring.
On va dire pareil, donne de l'argent pour l'open source aussi.
Ouais.
Bah ouais, à travers leur open source pledge justement, ils annoncent qu'ils ont distribué 750 000 $ en fait,
à l'aide de mainteneur, projet, tout ça.
Donc ça a augmenté de 50 % par rapport à l'année dernière.
Excellent.
Énorme.
Donc c'est cool.
Ils soutiennent plein de produits.
Enfin, il faut quand même comprendre qu'ils soutiennent plein de projets qu'on utilise nous au quotidien.
Donc c'est quand même super important.
Donc c'est une bonne nouvelle pour l'open source, pour les projets qu'on utilise, tout ça.
Et ça n'empêche pas non plus à nous développeurs de contribuer ou de donner un petit peu d'argent aussi pour les aider.
Je me pose aussi la question si au final, il n'y a pas une volonté, si tu veux, d'externaliser indirectement
toute la production de codes.
Au lieu d'avoir des mecs qui sont payés par centrie pour faire du code et pour faire du review de code,
pour faire de l'évolution d'outils open source, ils externalisent ça et ils le donnent à la communauté.
Et en fait, je pense que c'est un cercle virtueux.
Je ne dis pas que c'est mal, mais c'est un cercle virtueux aussi pour eux.
Parce que ça va avoir coûté bien moins cher de financer des mecs sur leur temps libre
pour faire de l'open source que d'avoir un ingénieur qui paye une blinde en interne
pour maintenir ce qu'ils utilisent au quotidien, indirectement.
Donc ça se tient aussi.
Ils doivent largement rentrer dans leurs frais aussi.
Oui, c'est clair.
Il ne faut pas oublier qu'ils sont là pour faire de l'argent.
C'est des sociétés à but du créatif.
Donc ils ont dû faire leur calcul, c'est clair.
Donc, si ils le font, c'est certainement dans une démarche.
Ils ont dû calculer leur truc.
Ils savent très bien, peut-être que ça leur coûte quand même un peu de l'argent.
Mais il y a aussi un côté marketing aussi au niveau de l'image.
Parce qu'on déjà en parle, c'est free, github, tout ça.
C'est bien, ils donnent de l'argent.
Donc il y a un côté marketing, il y a un côté, peut-être aussi,
de centraliser maintenant ce projet.
Ils utilisent aussi beaucoup de briques open source.
Donc ils ont tout intérêt aussi à ce que ce soit soutenu.
Pareil pour Amazon, tout ça.
Pour l'instant, on n'a pas entendu les gros comme Amazon, tout ça.
Donc est-ce qu'ils vont faire un peu dans le même style, on verra.
Par contre, ce qui est sûr, c'est un autre projet qui, eux, n'ont pas besoin de financement
parce qu'ils n'ont gagné suffisamment d'argent.
C'est le projet Bolt.new, qui est porté par la société StackBit.
Là, on va sky-folder un peu un projet immédiat avec un prompt.
Et ça va nous sortir, en tout cas, un résultat exécutable, directement exécutable.
Donc gros projet et ils annoncent des revenus mensuels un peu hallucinants.
Un peu indécents.
Après, je ne sais pas combien ils ont de dépenses derrière,
parce qu'il y a quand même une IA qui travaille derrière, il y a tout un système.
Alors Bolt, ça a été lancé dans la vie de conf, il y a un peu plus d'un mois.
Un mois de mille.
Oui, ils annoncent 4 millions de ARR, donc revenus annuels.
Ils ont atteint 4 millions, le chiffre, et encore ça va faire augmenter.
On n'est que au premier mois.
Apparemment, ça serait l'application qui utilise IA, qui est montée le plus vite.
En termes de revenus, toute la utilisation.
Après, il y a peut-être un peu de market là-dessus, de jouer sur des chiffres.
Mais néanmoins, on ne peut pas nier que l'expérience est quand même folle.
Moi, je n'ai pas fait un vrai projet avec, j'ai juste joué, testé.
J'ai fait un prompt, c'est plus.
Pourtant, je ne suis pas du tout un expert en prompting, que les choses soient claires.
Mais c'est hallucinant la qualité et la vitesse à laquelle tu peux sortir quelque chose.
C'est bluffant.
C'est vraiment très bluffant.
On voit beaucoup d'exemples sur Twitter.
Deux mecs disent que j'ai fait ça en 1h.
Même certains lanceraient des vrais projets.
Après, il y a quand même un peu d'intervention humaine pour corriger quelque chose.
Réajouter.
C'est pas magique non plus.
Mais c'est bluffant.
Ça te sort des trucs bien faits, complais.
Il peut y terrer derrière tout ça, un machin corriger.
C'est bluffant.
Moi, j'ai envie de dire, il y a beaucoup d'engouement sur cet outil.
Et puis d'autres outils aussi.
Ça me rappelle un peu l'arrivée d'une no-code.
Je pense beaucoup à ça en ce moment.
Ça me rappelle l'arrivée d'une no-code, on dit que c'est génial.
La no-code, on peut faire des sites, on a plus de développeurs.
C'est génial.
Il y avait beaucoup d'émotions là-dessus.
Et là, on est un peu dans le même style.
Finalement, est-ce que ce ne serait pas un outil no-code de plus ?
Me pose la question.
Alors là, pour le coup, je pense que...
Non, moi, je ne suis pas d'accord.
Je pense que ce n'est pas un outil no-code parce que quelqu'un qui n'a pas des compétences...
Même minimes en code, il ne va pas pouvoir s'en sortir.
Parce que tu auras toujours des micros à faire.
Et potentiellement, si tu ne connais rien en code, je parle.
C'est impossible. Tu ne vas pas y arriver.
Donc je ne crois pas.
Je pense que les meilleurs personnes qui vont...
Le meilleur résultat qui sortira d'un outil comme ça,
ça sera quand même des développeurs qui l'auront sorti.
Ou au minimum des personnes qui ont des notions de code.
Ils ne sont pas obligés d'être un développeur expert.
Mais ils connaissent un minimum d'informations relatives au code.
Et là, ils pourraient en tirer vraiment profils
et en tirer toute la puissance de l'outil, je pense.
À tester, en tout cas, si vous ne l'avez pas testé,
aller faire un tour, c'est vraiment super.
C'est super.
C'est vraiment sympa.
Et un petit peu de légèreté,
le géant suédois a refait son site internet, Ikea.
On connaît tous la compagnie qui nous vend des meubles,
à monter soi-même, ou en tout cas qui a une culture design.
Et ils ont fait leur site internet avec...
Avec Gatsby.
Non.
Non.
C'est pas le site e-commerce, c'est le site commercial.
C'est le point commercial, mais il y a déjà pas mal de pages.
Si tu vas dans Historie, il y a beaucoup de pages.
Ils l'ont fait avec Astro.
Donc ça fait toujours plaisir de voir des gros sites
qui sont énormément visités, partir sur des frames.
Tu as d'usvelt aussi.
Astro et Svelte.
Un petit truc sympa, léger, en finir l'épisode.
Exactement.
Et pour le coup, on est toujours en recherche de la justification
d'un framework qui est souvent...
On dit que c'est tellement nouveau que je ne vais pas l'utiliser.
Je pense que quand...
C'est une énorme boîte comme IKEA.
Refais ton site internet commercial avec Astro.
Je pense que c'est un signe relativement fort en disant
que ces gens-là considèrent que la technologie est suffisamment mature
pour mettre leur site internet avec cette technologie.
C'est un signal plus que fort.
C'est clair.
J'aimerais bien savoir ce qu'ils ont utilisé en arrière.
Ils ont pris un CMSL S, je ne sais pas si ils communiquent dessus.
En tout cas, on n'a pas...
Ils ne le disent pas.
C'est cool.
C'est un signe de maturité pour une techno
quand il y a des grosses boîtes qui l'utilisent.
Clairement.
Patrick, on en reste là pour aujourd'hui.
Un grand merci à tout le monde d'être restés jusqu'au bout de l'épisode.
Un petit pouce, discuter, un petit commentaire.
Si vous avez des questions aussi, ça nous fera grandement plaisir.
On vous dit à bientôt pour un nouvel épisode.
Ciao ciao.
Merci, ciao.
Episode suivant:
Les infos glanées
DoubleSlashPodcast
Double Slash, un podcast sur le développement web. Retrouvez-nous régulièrement pour parler de sujets variés tels que la JAMStack, l’accessibilité, l’écoconception, React.js, Vue.js, Next.js, Nuxt.js, le CSS et des retours d’expériences sur des implémentations.
Tags
Card title
[{'term': 'Technology', 'label': None, 'scheme': None}, {'term': 'Technology', 'label': None, 'scheme': 'http://www.itunes.com/'}]
Go somewhere
Self Hosting et Kamal 2 avec Guillaume Briday