Kilian Valkhof - Polypane, Electron, Superposition
Durée: 57m16s
Date de sortie: 22/10/2021
Join as as we chat with Kilian Valkhof, an indie developer with a passion for building developer focused tooling. On this episode we discuss his product Polypane, a browser built for web developers.
- https://polypane.app/
- https://www.electronjs.org/
- https://github.com/browserslist/browserslist
- https://superposition.design/
- https://cssstats.com/
Tooltips
Andrew
Justin
Kilian
Il y a plein de outils qui peuvent vous dire
que tout le monde a fait mal avec votre site
et que vous êtes un développeur terrible.
Polypain fait ça aussi.
Mais je vais aussi essayer de vous dire
qu'en fait, pour faire ça, peut-être que vous devez faire ça.
Ou alors, c'est le step de la rémediation.
Bonjour, bienvenue à la podcast de DevTools FM.
C'est un podcast sur les tools de développeur et les gens qui les font.
Je suis Andrew et je suis mon co-host Justin.
Salut tout le monde.
Aujourd'hui, notre guest est Kylian Valkov.
Il est un développeur avec une passion pour créer un software de développeur
et a créé une liste de tools qui ont aidé les développeurs
pour faire des websites mieux.
Kylian, vous voulez vous interpréter et savoir comment vous avez fait ici un peu plus?
Je suis Kylian.
Je suis un développeur de web de la Nédale.
Même si je n'ai pas été développé sur les websites
depuis les dernières années,
parce que j'ai sorti de la réjouer,
comme les mots, pour développer des applications desktop.
Mais je vais toujours utiliser des services HTML et de JavaScript pour faire ça.
Donc, ce n'est pas beaucoup de différence.
J'ai commencé très longtemps.
Je faisais mes premières websites quand j'étais 11,
et j'ai commencé ma première agence de web de développement à 16.
J'ai créé ça pour 14 ans,
et ensuite j'ai switché sur les applications desktop.
Donc, j'avais toujours été construit comme des tools,
et des libraries et des frameworks pour moi-même
pour m'aider à m'aider à mon travail.
Et j'ai développé ce petit browser de ma propre
qui m'a vraiment aidé à faire des websites responsables.
Et à l'initialité, je n'ai pas vraiment obtenu ça.
C'était juste un bon moyen de construire des websites
jusqu'à mes heures,
et c'était 60% plus rapide
qu'à ne pas utiliser ce petit tool d'application d'un petit.
C'est quand j'ai décidé qu'il y avait quelque chose ici.
On va faire le switch.
Oh, bien.
Vous avez commencé comme une agence de web de développement
et puis, en essayant de faire plus...
Vous avez travaillé plus optimisé pendant cette période.
Vous avez créé PolyPlan et décidiez de créer une compagnie de la société.
Oui, c'est PolyPain sans DL.
Oh, PolyPain, pardon.
Pas de problème.
Donc, PolyPain semble être un projet assez ambitieux.
Nous savons pourquoi vous avez construit ça.
Vous voulez faire votre développement plus vite.
Mais pour ce que je vois, c'est comme un tout browser
plutôt que d'une extension ou un site de web.
Pourquoi avez-vous choisi construire ça comme un tout browser?
Je l'ai joué avec Electrol.
Quand j'ai commencé à travailler sur ce que serait polypain,
en 2015,
j'ai été à ça pendant un temps.
Et, en même temps, les types de choses que j'ai voulu faire avec les web sites
n'étaient pas vraiment possibles comme un web site.
Parce que vous ne pouvez pas juste randomement
mettre des autres web sites dans votre site.
Les autres web sites n'aiment pas ça.
Et puis, pour les extensions de browser,
vous allez très vite aller dans toutes les sortes de
étranges, de l'origine cross,
et en utilisant Electrol, je pouvais travailler sur toutes ces sites.
Ça fait un peu de sens.
Qu'est-ce que l'un des premiers features de killer de PolyPain
qui vous a pas vu construire?
Vous avez vu votre site à différentes dimensions
ou est-ce que c'est plus que ça?
Ça a vraiment commencé comme un peu de bâtiment de l'iframe site-by-site.
Parce que, à ce moment, je n'avais pas pu changer
l'ensemble de la compagnie pour utiliser Sketch.
Avant ça, nous utilisons Photoshop.
Et ce que Sketch fait, c'est que c'est un artboard.
Maintenant, tous les tools de design ont un artboard,
mais à l'époque, c'était plutôt de l'invité.
Donc, quand je l'ai designé en Sketch,
j'avais un overview vraiment cool
de toutes les sizes responsables,
parce que j'aurais un artboard mobile
et un artboard tablette,
et puis un artboard desktop site-by-site.
Et je pouvais très facilement comparer.
Et puis, je suis revenu à Chrome.
Et je pouvais seulement voir un de ces à l'époque.
Et si je voulais comparer,
je voulais réciser en haut et en haut.
Donc, ça a vraiment commencé à me détenir.
Et c'est généralement quand je décide de construire quelque chose.
Donc, ça a vraiment commencé avec ça.
Et puis,
de là, je me suis basé sur
d'autres choses que j'ai besoin
comme développeur.
Donc, une des choses que j'ai implementées très rapidement
c'est que j'ai utilisé un CSS
et puis j'ai trouvé
toutes les séances de médias que j'ai utilisées.
Et puis,
avec un clic,
vous pouvez créer des pains
basées sur les séances de médias que vous avez utilisées.
Donc, vous voulez juste avoir
un overview mobile,
un overview tablette
et un overview desktop.
Vous avez 600 pixels,
620 pixels
et 85 pixels,
ou quelque chose.
Les styles que vous avez en fait
construits pour,
et ça m'a vraiment aidé
à voir si vous êtes en train de
mettre 20, 30 différents pains.
Comme peut-être que vous êtes en train de faire
ça sur le site de la séance de médias.
Mais aussi,
ça va très rapidement
vous aider à savoir
où sont les caps.
Parce que,
très souvent,
il y aura des séances
que vous ne payez pas
beaucoup d'attention.
Ils sont comme les séances entre les séances.
Et ça devient super apparence
si vous vous en avez
des séances de médias.
C'est super intéressant.
Je pensais que c'était
comme vous avez défendu les séances de la séance,
mais que ça va en faire
et que ça va passer au CSS.
C'est super cool.
Parce que,
même si,
comme un développeur
vous êtes supposé
à mettre des séances de médias
en une direction,
ce n'est souvent pas le cas
avec des bases de la séance.
Et ça semble être
un tool super utile.
Oui, et c'est exactement
où
les caps se sont mis,
où vous avez un max-width
et un min-width
et ils se sont juste intersacés
dans les 10 pixels.
Et dans ces 10 pixels,
tout est déroulé.
Donc,
et vous ne savez pas
parce que,
vous voyez,
vous avez des différents devises
et ils sont très sain
dans votre size mobile,
votre size tablette.
Et c'est toutes ces séances
entre les séances
que beaucoup de développeurs
ne sont pas vraiment
en train d'avoir,
c'est que
sur le desktop,
très peu de les browsers
sont en train d'avoir un maximum de
des utilisateurs.
Donc,
pendant que nous avons
notre 27 inch 4K
huge,
magnifique monitor,
votre site va être
vu sur le Chromebook
avec un screen
de la size de un stamp.
Et ils ne sont pas seulement
en train d'utiliser
le screen pour le browser
parce qu'ils ont quelque chose d'autre
qu'ils veulent voir aussi.
Et c'est le type de size
que vous aussi besoin de
optimiser.
Une autre question technique
que j'ai,
c'est,
comment vous gardez
toutes les
pains individuels
dans l'insync,
leur state insync.
Donc, j'ai noticing
deux choses sur la démarche.
L'un est que vous vous scrollez,
ils se scrollent tous.
Donc, c'est une chose.
Et il y a aussi
ce très intéressant
CSS
playground
que vous avez
où vous pouvez
faire un certain...
Il y a aussi le console
de dev,
mais vous pouvez faire
des spécifiques CSS
et c'est appliqué
à toutes les pains
en même temps.
Quoi...
Comment ça fonctionne?
Donc,
juste un whole lot
of custom code.
Donc,
whenever a website loads,
I parse all the CSS
to get the breakpoints,
but also to get,
for example,
all the hover styles.
And then I add
a whole bunch of listeners,
you know,
for clicks,
for hovers,
for keyword inputs,
for scrolling.
And from there,
it's just making sure,
in a very smart way,
to propagate
the different events
into all the different pains.
It's a lot of keeping track of stuff
and then
waiting for events to come in.
Yeah, sure, not cool.
I notice it has
a ton of different features
and a ton of different tools
built into it.
In your opinion,
what are some of the cooler ones
that aren't just like
those base case of responsiveness?
I do think
that the hover syncing
is really cool.
So in polypain,
if you hover in any of the pains,
the hover effects happen
in all the pains.
So that really brings
the idea that
you're not looking at
multiple instances of your site,
but you're looking at
your site that just happens
to be shown at multiple sizes.
Because that's the dream,
like the full overview.
But then,
so,
usually when I explain
the features of polypain,
it takes me over now.
It's very hard to take a feature
off the top of my head.
But for example,
I do,
I also parse all the metadata
in your site.
And then also,
if you have a web manifest,
I download that.
If you have OMBED data,
I download that.
If there's a robot.txt,
I parse that.
So I give you
all of this information,
like your theme colors,
your document viewport,
your robots.txt data.
And then,
everything that I can come up
with, that's usually a manual check.
I just write code for it.
So, for example,
if you have a robot.txt,
I just check whether
the page you're currently at
is blocked by the robot.txt or not.
For each of the
user agents that you have specified in it.
So, polypain will just tell you
if you go to
slashwp-admin
for WordPress sites.
And then it will tell you
this page is blocked for Googlebot.
Because that's what's in the default
robot.txt.
I just do that for everything.
If you have things in your
viewport declaration,
like user scalable is no,
or a minimum size,
or a maximum size,
I show warnings for that,
because you're better off
not putting that into
a viewport,
because it breaks the web
for some people.
And then, like, lastly,
for that thing specifically,
I take all the metadata
and I reverse engineer it,
how social media,
Twitter and Facebook
create their open-graph previews.
So, I have pixel-perfect previews
of all of those.
But then also,
using the exact same data
that those sites use.
Because, like, Twitter has their
Twitter tags,
and Facebook has their open-graph
tags.
So, if you go to
their documentation,
they'll say you need to use
open-graph tags.
But if you don't,
then Facebook will just use
the Twitter tags
because they're there.
And, you know,
Facebook wants to show
the coolest-looking preview.
So, it's just going to use
the data that's there.
But they don't have that
written down anywhere.
So, I reverse engineer
all of that
for Twitter, Facebook,
Slack, Discord, LinkedIn,
and Telegram Web.
And then also,
the Google Search preview.
And I make sure that
it displays exactly
as it's displayed on those sites.
So, you can check your pages
before your site's online.
And also, you no longer have to, like,
post a link to Twitter
and then very quickly delete it,
which, you know,
a lot of developers do.
So, it's just a much nicer
way to deal with this.
And it's something I spend a lot of time
on getting it right,
just so you can be sure, like,
if there is a specific word break
in a preview in Polypain,
you're going to get that exact
word break when you share it
on Facebook or whatever.
C'est vraiment cool.
C'est juste d'avoir,
comme, toutes les différents tools
que vous avez besoin de construire
un site,
construit dans un autre tool,
ça semble super puissant.
Parce que si vous ne savez pas
de l'OMBED
ou d'autres trucs comme un nouveau
développeur,
ce n'est pas un truc qui existe.
Et vous devez vous décider
que votre Google Search
soit en train de se faire.
En tant que Polypain,
ça semble que
ça peut vous conduire
pour les meilleures pratiques
pour votre site.
Oui, donc, oui,
j'ai vraiment essayé
de faire ça,
comme dans l'ensemble,
comme sur le tout.
Je suis très fort
focussé sur l'accessibilité,
mais ce que je toujours
essaye de faire
n'est pas juste de me dire
que les gens ont fait
quelque chose d'accord.
Parce qu'il y a plein de tools
qui peuvent vous dire.
Toutes les choses
que vous avez faîtes
d'accord avec votre site,
et maintenant vous êtes
un développeur terrible.
Polypain fait ça aussi.
Mais je t'ai aussi essayé
de vous dire,
que si vous ne faites pas
ceci,
peut-être que vous faites
ceci.
Ou, ici,
le step de remédiation.
Par exemple,
dans le contexte de polypain,
je construis
un checker de contraste
qui va juste
dans votre site entier.
Et puis pour chaque
unique parlement de texte
et de background,
il va calculer
le background réel.
Si vous avez
plusieurs backgrounds
avec transparencies, etc.,
juste flattent ça.
Et puis,
si il y a un texte
qui n'a pas assez de contraste,
je récalculerai
la couleur la plus近
que ça fait.
Et je vous le donne.
Donc, vous pouvez aller
dans votre site,
trouver tous les instances
de
des issues de contraste.
Et plutôt que
de vous avoir
de retour au design,
de faire un screenshot
et de pointer des éros,
comme cette couleur
doit être réveillée
et cette couleur doit être réveillée,
de l'attention
un jour,
ou d'autre.
Ou de retourner
au système de design,
si vous avez ça.
Et puis de se faire
de la façon dont
je suis allé,
cette hexagarde
que j'ai correspondée
à la 2 bleues 400,
mais je dois en mettre
bleues 300.
Je peux juste
le garder dans la page,
pour que
le loop de feedback
soit le plus petit possible.
C'est génial.
Il y a des temps
où j'ai été
éditing CSS
et des tools de dev,
et ça me donne
un signage de morni
et ça ne me disait rien.
Il y a un problème
ici.
Je ne sais pas
comment fixer ça
ou ce qui est en fait
le mauvais,
mais je vais juste
essayer de le faire.
C'est cool que ça
t'enlève la main.
Oui, je pense
que c'est important,
comme en général,
parce que
beaucoup de développeurs
sont en train de faire
une ligne de déclin.
C'est très souvent.
Donc la choice
n'est pas
entre
fixer maintenant
parce que Polypain
m'a dit
comment fixer ça
ou je vais faire
des recherches plus tard
et fixer ça.
C'est entre
que je fixe maintenant
ou je ne le regarde pas
encore,
parce que la prochaine week
je suis
sur un autre projet
et ça
a tout le priorité.
Si vous faites
ce loop de feedback
le plus petit possible,
vous faites aussi
très facile
de fixer
comme vous l'avez fait.
On parle de l'électron
pour un second.
Je sais
que l'électron
peut avoir
quelques défis
de performances,
d'autres,
souvent,
ne pas nécessairement
dans le contexte
de
si vous savez
comment ça marche
et comment l'optimiser.
Dès que vous
créeriez un browser
sur le dessus de l'électron,
c'est plus
comme le cas naturel
de pourquoi
nous faisons ceci.
Donc,
pouvez-vous parler
un peu sur votre expérience
?
Surtout,
si il y a des défis de ceci,
je sais que vous êtes
en train d'involver
l'électron,
donc,
si vous avez plus d'envies
en utilisant l'électron
pour construire des apps desktop,
j'ai hâte de vous entendre.
Oui,
donc,
en fait,
ma app desktop
de career
a commencé
avec des apps
que j'ai créées
en QT
et GTK
qui
n'est pas grand
comparé
à des développements web.
Les développements web
sont des
des développements
un changement de page
pour réfresher
et vous verrez si ça fonctionne.
Ce n'est pas
ce que la
software des desktop s'est
utilisé.
Donc,
j'ai utilisé le Python
même si,
vous savez,
c'est trop bas,
c'est pas ça.
Donc,
la page de refreshure
devient
plus close
à l'app
et a commencé
et paye
la faute de Python,
ce n'est pas beaucoup,
mais c'est plus
que
de refreshir
une page,
c'est vrai.
Donc,
j'ai eu l'expérience
et puis
en temps,
ces différents outils
sont différents
que vous utilisez
les technologies web.
avant l'électron,
il y avait des kits web,
et puis,
avant les kits web,
il y avait d'autres outils.
Donc,
ils étaient
juste un meilleur
et meilleur
pour le manière dont j'ai travaillé.
Et c'est le cas
pour les
les apps d'électron
maintenant.
Il y a beaucoup de gens
qui ont beaucoup de bonnes
connaissances
sur comment faire des websites.
Et
il se trouve
que si vous savez
comment faire des websites
et les websites
sur chaque plateforme,
ce
est un
fantastique
moyen
d'utiliser les applications
pour plusieurs plateformes.
Donc,
par exemple,
sur Mac,
comme,
les utilisateurs de Mac,
sont toujours très vocables
pour les apps d'électron,
mais
ils sont vraiment
seulement vocables
pour les apps d'électron
qu'ils savent
les apps d'électron.
Parce que,
si ils ne savent pas,
généralement,
vous ne vous entendrez pas
beaucoup
sur ça.
La
chose
intéressante
est
que
si
la Mac app
n'était pas
d'électron,
ce serait un app
très cool
natif.
Si la Mac app
n'était pas d'électron,
ce n'était pas d'électron.
Il n'y aurait pas
d'électron,
il n'y aurait pas un app Mac.
Il
serait juste d'une app Windows,
car c'est
où l'audience est.
Parfois,
avec d'électron,
vous
vous avez
des apps Mac
pour frein.
Et je pense
que c'est un
réel
pouvoir.
Et c'est aussi pourquoi
je pense que
beaucoup d'entreprises
ont commencé
d'utiliser d'électron,
car vous pouvez
étudier votre équipe
plus loin
qu'en avoir
un équipe Mac
pour les les plus
Vous pouvez
le faire
avec les plus
qualifiés.
Il est
super
powerful.
Et c'est aussi
ce que vous voyez
dans l'adoption
d'électron.
La
company
d'Escrypt.
Nous avons
un app d'électron
et
cela
c'est
développement.
Quand on parle de l'application d'électron, c'est parce qu'il y a une expérience malheur.
Mais ça ne doit pas être.
Le code VS est un exemple plus fameux d'une application d'électron.
Même si c'est une application d'électron, c'est super vite.
C'est un truc qu'on pense pas vraiment sur le web.
Pour l'instant, Chrome ne nous fait pas de la même chose.
Et ça, votre app n'est pas long de l'entraîner pour les plus grands liens de la matière.
Vous pouvez avoir des liens de liens dans votre app, mais les utilisateurs vont le référer à un point.
Et ça va être tout.
Mais avec l'application desktop, ce n'est pas le cas.
C'est un truc qui est très important.
C'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui est très important.
Et c'est un truc qui estlass rouge.
Et qu'est ce qui peut faire avec ces 들어�ies ?
un whole bunch of different sets and like actionable feedback to fix them.
So for example, I work on basically the viewer page for a video on d script and I just popped it into here and it told me that I was not compressing the subtitles for the video which like I would have never guessed by looking at the developer tools.
This tool pointed out to me immediately and it's awesome to have the actionable feedback and this really ties into what you build because you're all about this actionable feedback built into the developer tools.
Yep.
Yeah, this site is really good and they've been working on it pretty extensively as well.
It's gotten really fast and it has been adding a ton of features.
So it will also do SSL labs test now for the HTTP certificate and that used to take like literal minutes and now it's just a matter of seconds and you they've parsed your entire SSL certificate to figure out like if you use the right algorithms and if you have the right settings for the SSL certificate.
It's really nice.
Yeah, web page test is great for performance tests.
They've been around for quite a while now.
Yeah, but they're, they're good.
It's good to have as many battle-hardened tools around you as you can.
So I have two Rust related tool tips this week.
Given that I've been working in Rust at Oxide.
So the first is one that I discovered on Hacker News this week.
It's called seedRS.
We talked a little bit about web assembly.
So seedRS is an Elm-like framework for building UI and Rust.
Yeah, it compiles everything to web assembly and there's a, there's a communication layer between web assembly and the DOM.
And yeah, so you want to build UI and Rust.
There you go.
That sound, that sounds interesting.
I don't know, I don't know if I'd want to go there, but like do you do CSS in here too somehow or like.
You can, you can specify.
Is it very close to Elm?
Not very close now.
It uses a similar model.
Okay.
Cause I'd like, I think it's a shame that Elm never really took off the way other frameworks have taken off.
Cause I think it's, it's a really neat idea.
But on the other hand, it was really difficult to get into as well.
I've tried building a bunch of stuff with Elm and it's, it's really difficult to wrap your head around the way they want you to do like functional programming.
Have you done any of that with seeds?
I have not.
No, this is just something I just sort of discovered recently, like yesterday actually.
So I haven't actually had a chance to play with it too much, but.
So no comment there.
No comment there.
It is, it is just sort of an interesting thing.
So I mean, it's a framework that's specifically targeting web assembly as a mechanism for deploying an app.
So it's just, it's just an interesting idea.
I think with Elm, they got a little too opinionated on, they get very opinionated on how you must build a site and what you can do with language and what you can't do with the language and to maybe went too far in the direction there of control.
Yeah.
At some point, they were happy to tell people that you shouldn't be doing this in Elm or you shouldn't be writing this software like that.
That's not how it works.
Yeah, it seems like these languages that are built, like kind of on top of the web stack as like the way to do UI, have a rough time of catching on like re-script seems like another one where it's like, yeah, we made everything better, but it's like such a paradigm shift that it's really hard for a lot of people to switch over.
Right.
So this is Ferdy.
I think it's from Ferdinand because it's a fork of friends with a Z.
I used friends for a very long time because it's an ElectroDepth that you basically add in all the different social media that you use.
So, you know, like you too, I guess, I mean, like dozens of Slack channels and they each have their own URL.
So they become super annoying to manage.
And I can just throw them all in this app along with Discord, along with TweetDec, with, you know, whatever else.
And that's just really useful because it's also it's in like this separate app.
It's not a tab.
I can tap to that's dangerous because you can get sucked into the tab and then lose time.
And I used friends for a long time, but Slack no longer supports the version of Chrome they run on.
And Ferdy is a more up to date fork of it that I switched to, I think, a week ago.
And it's been working really well.
I can recommend it to everyone.
En fait, que ce soit aussi très bien.
Je suis surpris que c'est une source de l'opinion aussi.
Ok, maintenant, on va au plus déviseur des topics de aujourd'hui.
Alors, ce que je vous ai dit est un projet de NFT qui est un peu difficile à rappeler.
Et c'est un projet qui est un peu difficile à rappeler.
Et c'est un projet qui est un peu difficile à rappeler.
Et c'est un projet qui est un peu difficile à rappeler.
Et c'est un projet qui est un peu difficile à rappeler.
Et c'est un projet qui est un peu difficile à rappeler.
Et c'est un projet qui est un peu difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est un projet qui est difficile à rappeler.
Et c'est tout pour cette semaine.
C'est l'épisode de DevTools FM.
Merci d'avoir regardé le podcast Killian.
C'était beaucoup de plaisir de vous parler.
Merci d'avoir regardé.
Vous avez un très unique visage
sur ce que les browsers et les tools doivent être.
Je pense que c'était une belle conversation.
J'ai plaisir.
Oui, c'est un bon visage.
Fais surez de nous suivre sur Youtube et à tous les sites de votre podcast.
Merci d'avoir regardé.
Sous-titres réalisés par la communauté d'Amara.org
Episode suivant:
Les infos glanées
devtools.fm:DeveloperTools,OpenSource,SoftwareDevelopment
A podcast about developer tools and the people who make them. Join us as we embark on a journey to explore modern developer tooling and interview the people who make it possible. We love talking to the creators front-end frameworks (React, Solid, Svelte, Vue, Angular, etc), JavaScript and TypeScript runtimes (Node, Deno, Bun), Languages (Unison, Elixor, Rust, Zig), web tech (WASM, Web Containers, WebGPU, WebGL), database providers (Turso, Planetscale, Supabase, EdgeDB), and platforms (SST, AWS, Vercel, Netlify, Fly.io).
Tags