Ego

Adieu RxJS ! Vive les Signals ! Oh wait… (Anthony Pena) - YouTube

#Ego #Angular #RxJS #Signals #Frontend

https://youtu.be/oMbx0UyYBog

Un peu d'auto promo pour le replay d'un talk que j'ai joué à Voxxed Days Luxembourg sur Angular, les Signals et RxJS

Frontend

Ajouter une méthode dans une classe TypeScript qui n'avait que des attributs. Lancer un build => 💥 -- @Brack0_Dev

#TypeScript #Frontend #Backend #JavaScript

Je reprends le thread de Denis Souron que je trouve assez pertinent en termes de conseil sur l'usage de TypeScript et des classes :

Petit piège classique en TypeScript, et j'ai marché en plein dedans. Ajouter une méthode dans une classe TypeScript qui n'avait que des attributs. Lancer un build => 💥 Explication : l'erreur TSC intervient à plusieurs endroits et à chaque fois pour la même raison 🔽

Au lieu de retourner une instance de classe, on construit un object literal dont les attributs correspondent à ceux de la classe. C'est très pratique quand on veut recopier une partie des attributs, on fait juste un spread. Exemple : { ...otherInstance, foo: "bar" } 🔽

Cette astuce, ce "hack" comme on aime bien dire dans le jargon, est un excellent moyen de se tirer une balle dans le pied. On peut faire correspondre le type d'un object literal et une classe si elle ne possède pas de méthode. Vous construisez une bombe à retardement 🔽

A partir du moment où vous choisissez d'utiliser des classes, faites des constructeurs et passez systématiquement par des instances de classe. TypeScript (et JavaScript) ne nous facilite pas la tâche en n'autorisant qu'un seul constructeur par classe. 🔽

Pensez aux surchages (plusieurs signatures pour une même fonction), cela fonctionne aussi pour les constructeurs. Ma valeur sûre : avoir un seul paramètre dans le constructeur. Ce paramètre est un objet qui contient tous les attributs de la classe. 🔽

Cela vous permet de faire des recopies d'objets facilement, tout en gardant une instance de classe, donc avec les méthodes accessibles. Avant : { ...otherInstance, foo: "bar" } Après : new Foo({ ...otherInstance, foo: "bar" }) 🔽

Peu de changements dans le code, mais beaucoup moins d'effets de bord. Le prochain dev qui passera par là vous remerciera. En résumé, faites des classes + instances de classe + méthodes de classe OU des interface + object literals + fonctions, mais ne mélangez pas les deux SVP😇

EDIT : On peut avoir les deux dans la codebase. Il faut juste éviter de le faire sur les mêmes objets. J'ai volontairement pas abordé les modifications du prototype et les décorateurs TS, c'est assez funky.

The CSS attribute selector has a case-insensitive mode | Stefan Judis Web Development

#CSS #Frontend #UI

Découverte : on peut faire un sélecteur CSS sur attribut qui ignore la case de la valeur 🤯

/**
 * matches:
 * <div class="foo">...</div>
 * <div class="Foo">...</div>
 * <div class="fOo">...</div>
 * ...
 */
[class=foo i] {
  color: red;
}

Vitest Browser Mode · vitest-dev/vitest · Discussion #5828 · GitHub

#Test #Frontend #Vitest #Node.JS #TypeScript #JavaScript #Web

Vitest va voir naître un mode browser dont le but est l'exécution des tests dans un vrai navigateur plutôt qu'en Node.

"retour en arrière !" diront certains. "pourquoi faire ?" diront d'autres. Pour moi si vous faite du front, votre runtime c'est le navigateur et rien ne vous garantit une meilleure précision des tests que les exécuter dans le navigateur. Dans le même temps, comme dit dans le message de sheremet-va : si vous faite du front et exécutez votre côté en Node, vous introduisez un environnement d'exécution spécifique à vos tests ce qui veut dire que vos tests peuvent parfaitement fonctionner mais pas votre application…

À suivre car si comme expliqué par sheremet-va tout fonctionne out of the box simplement en disant "mode = browser" et en installant le bon package (comme c'est le cas aujourd'hui) ça va ouvrir une porte qu'on n'aura pas de bonne excuse de ne pas prendre.

slash pages

#Blog #Web #Frontend

Listing des "slash pages" les plus courantes et leurs descriptions. Les slash pages sont des pages qu'on peut s'attendre à trouver sur des sites/blogs perso pour communiquer aux gens : comment les contacter, des recommandations, ce qu'on aime ou pas, où on vit, etc.

Je vais essayer de mettre ça en place sur le blog ! 😁

Si vous utilisez le code de Polyfill.io sur votre site comme des centaines de milliers d'autres développeurs, retirez-le à l'immédiat car ce domaine est en cours d'exploitation par des cybercriminels

#Sécurité #Navigateur #Frontend #JavaScript #Web

Problème de sécurité par exploitation par des cybercriminels de polyfill.io !

Préférez toujours le fait de mettre en local les polyfills (soit une copie des fichiers js en local soit compilé avec votre application), c'est plus efficace (depuis qu'il n'y a plus de cache cross-onglet dans les navigateurs) et plus sécurisé !

Persson Dennis - Write SOLID React Hooks

#React #Frontend #Architecture #SOLID #TypeScript

Article compliqué à résumé car il explique point par point comment et pourquoi appliquer les principes SOLID à React ! Et on devrait clairement faire ça vu comment le code React c'est généralement du code spaghetti...

Backend

Announcing DuckDB 1.0.0 – DuckDB

#Backend #DuckDB

DuckDB passe en 1.0.0 ! Annonce très importante pour cette base de donnée qui vise comme SQLite une stabilité exemplaire sur le long terme !

Cette base de donnée est extrêmement intéressante en ce qui concerne l'analyse de données de part son format et l'orientation du moteur qui est taillé pour aller vite sur ce genre de use case !

Don't Microservice, Do Module | Ali Khaleqi Yekta

#Architecture #Microservice #Monolith #Backend

L'article évoque la complexité inutile des micros services, les avantages si petits face aux inconvénients, à quel point la définition de micro service ne veut pas dire grand-chose, etc.

Très content de lire un article sur les monolithes modularisés qui sont la plupart du temps bien plus intéressants à utiliser et bien plus facile à maintenir, scale, construire, faire évoluer, versionner, déployer, etc. Ce qui compte c'est le côté stateless pour profiter de bien 99% des avantages des micros services !

IA

Experimenting with local alt text generation in Firefox Nightly - Mozilla Hacks - the Web developer blog

#Mozilla #Firefox #Accessibilité #IA #Web

Firefox 130 va introduire un modèle d'IA expérimental pour générer des alt pour les images. Tout s'exécutera 100% en local avec une précision correcte. Une idée intéressante qui pourrait améliorer l'exploration du web pour les personnes malvoyantes à long terme.

On voit que la stack choisie (ONNX + transformer.js) ouvre les portes de l'IA dans Firefox avec des modèles complètement différents de ce qui est montré ici. Ça promet de belles évolutions sans forcément un gros coup énergétique si les modèles sont bien choisis. En tout cas, à suivre, et Mozilla montre que Firefox n'est plus le navigateur à la traîne, mais apporte des vraies améliorations.

Note : en parallèle, côté Chrome c'est l'annonce du forcing du Manifest v3 en 2024 qui fait du bruit, avec des contraintes biens spécifiques à Chrome (et tous les dérivés) pour empêcher les bloqueurs de pub d'être efficace…

Sécurité

Chat Control : les utilisateurs refusant une analyse intrusive ne pourront pas partager des photos et des liens, la France renoncerait à son veto et la loi pourrait encore être approuvée par l'UE

#Vie-privée #Sécurité

Une porte s'ouvre tout doucement sur la surveillance de toutes les messageries avec détection à base d'IA (une IA est considérée comme fiable à partir de 60-70% de taux de réussite, on se rappelle). Donc si ce texte passe, il faudra partir du principe que toute messagerie conforme ne sera plus privée…

Ça concerne aussi bien les particuliers que les entreprises ! Là on parle de l'analyse de tout avant envoie, donc même un Slack d'entreprise verrait automatiquement ses messages analysés avec à la clé potentiellement une partie des captures d'écrans (usage massif on se rappelle) qui va partir dans la nature…

Jeux-videos

Les utilisateurs de Steam ont dépensé 19 milliards de dollars pour des jeux auxquels ils n'ont jamais joué, soit plus que le PIB du Nicaragua, du Niger, du Tchad ou de Maurice

#Jeux-videos #Steam #Data

Ça paraît énorme 19 milliards mais en fait :

On remarquera que 1 900 Million / 73 Million ça fait 26€.

Donc l'utilisateur moyen de steam à potentiellement un jeu à un prix moyen qu'il a pas encore lancé.

Bref, faire des gros chiffres sur la base de dizaines de millions de personnes, c'est de la merde.
-- walfrat (en commentaire)

Il n'empêche que c'est évident sur le volume que beaucoup d'utilisateur Steam ont des jeux-videos jamais lancés (moi le premier) : en tenant compte des packs, des promos, des humbles bundle, etc. C'est obligé et normal 🤷‍♂️

Les joueurs qui voulaient finir Portal sans portails. - YouTube

#Jeux-videos #Portal

https://youtu.be/dnt4BbC-rD8

Vidéo incroyable sur Portal, un jeu-vidéo dont le but de jouer sur la physique avec la manipulation de portail pour pouvoir passer d'un endroit à l'autre. Et un groupe de gens se dit que jouer à Portal sans poser de portail ce serait plus intéressant… 🤯

C'est incroyable de voir à quel point ils ont détourné tous les bugs du jeu pour arriver à ça !

Divers

Rudy Onfroy on LinkedIn: Chef de projet :« Chaque mois, tu devras remplir un CRA. »« Tu noteras…

#Métier-de-dev

Je cite le post entier de Rudy Onfroy car je trouve ça super pertinent :

Chef de projet :
« Chaque mois, tu devras remplir un CRA. »
« Tu noteras dans la bonne case le temps passé. »
« Quand tu bosses sur le projet Y, tu affects ça là. »
« Si tu bosses sur de la maintenance, tu affects ça ici. »

Développeur :
« Ça sert à quoi de prendre du temps pour remplir ça ? »
« Je bosse sur les sujets que tu me demandes. »

Chef de projet :
« On note tout, car on est datadriven. »
« On a besoin de ça pour prendre les bonnes décisions. »
« On connaîtra le temps qu'on passe sur chaque projet. »
« Comme ça, on peut estimer le coût de maintenance. »

Développeur :
« J'ai bien rempli mon CRA. »
« Tu peux me le valider ? »

Chef de projet :

« J'ai besoin que tu fasses quelques modifications avant. »
« Tu as passé 12 jours sur de la maintenance. »
« Enlève en 9 et déplace-les sur le projet Y. »

Développeur :
« Pourquoi on fait ça ? »

Chef de projet :
« On a passé trop de temps en maintenance. »
« Ce n'est pas ce qu'on avait dit au Codir. »

Tu as beau avoir de la donnée, si la culture de ta boîte est mauvaise, tu n'es pas prêt de prendre les bonnes décisions.

Coding my Handwriting — Amy Goodchild

#Font

Idée intéressante (mais qui coûte pas mal de temps) : créer une police à partir de sa propre écriture !

Ça pose plein de questions, car à l'écrit on va ajouter des ligatures (connexions entre 2 lettres consécutives) différentes en fonction des paires sans y réfléchir.

Ici l'autrice de l'article vient nous expliquer sa démarche et comment elle a géré ses problèmes avec résultat assez propre ! Clairement elle a une belle écriture aussi, avec la mienne ça ne serait pas aussi propre ! 😂

Le problème avec les hub USB pas chers et bas de gamme - YouTube

#USB #Hardware #Divers

https://youtu.be/PliYO2bbYPw

La vidéo refait une passe sur les principes de fonctionnement de l'USB en particulier en ce qui concerne les Hubs USB qui ne sont pas du tout égaux entre eux !

Un bon rappel de comment fonctionne la bande passante, les contrôleurs et l'alimentation (avec en bonus le fait que la norme USB, les fabricants la respectent surtout quand ça les arrange…)

Pixar doesn't use GPUs (much). -- @lauriewired

#Divers #Pixar #Disney

Intéressant : Pixar et Disney ne font pas le rendu 3D des films d'animations sur GPU mais sur CPU. Pourquoi ? Les scènes sont tellement lourdes que jusqu'à très récemment il était impossible de mettre dans la mémoire du GPU la scène complète pour en faire son rendu 😅

Les décès de nouveau-nés explosent depuis l'interdiction de l'avortement au Texas | Slate.fr

#Société #Femme #Féminisme #Avortement

Comme d'habitude à chaque fois que des gens décident de contrôler la vie des autres, en particulier la vie des femmes, les conséquences sont dramatiques…

Mais comme à priori le plus important c'est lutter contre les "avortements de confort" (aucun sens ce terme mais passons…), plutôt que la santé physique et mentale des mères qui voient mourir leurs enfants dans la première année…

Paiement sans contact : il est désormais possible d’effectuer des achats de plus de 50 euros

#Paiement #Banque

"sans contact plus" : faire un paiement sans contact au-delà de 50€ mais en tapant son code 🤔 du coup c'est plus "sans contact" vu qu'on touche le TPE pour taper son code 🙃

La complexité de la simplicité

Article très intéressant (mais prenant des raccourcis aussi) sur la complexité des systèmes qu'on utilise au quotidien.

Je suis quand même assez d'accord avec Plum sur le fait qu'on choisit souvent des solutions très complexes à des problèmes qui ne le sont pas tant que ça et qu'on pourrait régler si facilement sans toutes les couches de complexité qu'on s'impose…

The Alternative Implementation Problem | Pointers Gone Wild

En résumé : si vous créez une alternative à un produit de référence, vous ne pourrez jamais que suivre ce que l'implémentation de référence fait et donc être en retard. La solution proposée est de plutôt choisir la voie de s'intégrer à la solution existante pour l'améliorer et devenir de facto le choix principal des utilisateurs.

Point de vue intéressant sur le fait d'implémenter une alternative à un autre produit à mon avis.

J'ajouterai quand même qu'à mon sens on peut aussi choisir de démarrer comme une alternative mais avec des choix différents pour être différent. Exemple : il y a beaucoup de "Trello-like", certains sont des clones purs, d'autres cherchent à apporter des features différentes pour ne pas être un bête clone mais apporter autre chose.

Crédit photo : Générée via Microsoft Designer avec le prompt suivant (+ Phot.AI pour étendre l'arrière-plan)

newspaper, reading, press, news