no más, no será necesario
y por lo tanto las librerías se ocuparán un poquito menos
venga, otra
Picking Colors, esta tiene
muy buena pinta, no sé si la habéis visto
pero
ya a día de hoy
ya existe una cosa que es
Input Type
Color, ¿no?
esto supongo que sí que lo habéis visto
esto es bastante fácil, ¿no? que con HTML5
puedes elegir un color, y haces esto
y tienes este input súper chulo
que además tienes esto
que esto básicamente es que tú puedes
pillar el color de donde te dé la gana, por ejemplo aquí
y te lo devuelve, y con esto
ya tendrías la posibilidad de saber
qué color has seleccionado el usuario
¿vale? o sea, eso está súper genial
pero, pero
claro, hay veces
que no sólo quieres hacer esto, sino
sólo quieres esta parte de aquí
esta parte de aquí, ¿sabes? esto es súper útil
pero sólo quieres esta parte
no quieres tener que tener el input y todo esto
bueno, pues para eso
justamente han hecho este
eyedropper
no sé qué
vamos a probarlo en Codilink
vamos a probarlo aquí
vamos a quitar esto
voy a ponerlo esto aquí
pero no funciona
yo me imagino que esto
si no funciona
simplemente un segundo
yo creo que será por un tema
de permisos
que en un iframe no lo podrás hacer
seguramente
¿ves?
ahora sí
yo creo que esto en un iframe no va a funcionar
pero fíjate
al final lo único que tienes que hacer es
const eyedropper
new eyedropper
y el resultado
haces el await del eyedropper
punto open tal
y ahora fíjate que mi cursor
se va a cambiar
para ser uno de estos
que selecciona el color
y entonces selecciono el color
y esto va a resolver la promesa
y ahora el resultado
tendrá el color
y ya está
súper fácil
o sea, súper súper fácil
es una pena
que aquí no funciona
bueno
a ver este await
igual
vamos a probar a hacerlo
bueno, vamos a hacerlo
con una promesa
normal y corriente
en realidad debería
debería funcionar
debería funcionar
debería funcionar
debería cambiar
pero yo creo que
que es un tema de permisos
a ver, tiene sentido
tiene sentido que esto
no lo pueda hacer
eyedropper
is not available
is not available
por qué no será available
eyedropper
aquí en javascript
a ver, puede ser
que tenga sentido
pero
ah, pues mira
ahora sí que funciona
ahora sí que funciona
ha sido
en ese momento
que no
o sea
a lo mejor es porque
me ha petado al principio
por lo de la sync
y entonces ha quedado
picueto
pero si refresco
y entro
ah, pues ahora tampoco
pero ha habido un momento
que no ha funcionado
porque ha aparecido ahí
el
pues no
no sé
pero ahora
lo he visto
durante un momento
vamos a ver
qué verdad
esto
requires
requires
user gesture
o sea
claro
el tema es
es que
es que hacer esto
nada más entrar
en la página
es un poco raro
o sea
set time out
mira ves
es que
uy
me ha petado Chrome
hasta aquí he llegado
hasta aquí
he llegado
te pasaste
a ver dónde
esto
lo voy a cerrar
todos los que íbamos antes
bueno
pues nada
se quedó
nos quedamos sin
Chrome 95
bueno
lo hemos visto
que funciona
es bastante
genial
el hecho de tener eso
y hay un montón de aplicaciones
que están utilizando Electron
que al final
van a poder hacer eso
y luego la última
porque bueno
esto es una conferencia
que van a hacer
la PWA Summit
que no sé si la conocéis
está bien
pero bueno
yo he estado mirando
está bien
porque habla mucho
de Proxy Web App
pero me sorprende
porque no sé
las veo un poco
no de capa caída
pero
que tampoco se le da
se le da tanta relevancia
pero bueno
tengo interés por este
Future of Web Panels
a ver si
se comenta algo interesante
a ver si es que
yo que sé
hay algo así
posible
with accessibility
no sé
es como que la propia Google
a veces
apuesta mucho
por las Proxy Web Apps
luego de repente no
también porque
canibaliza
la Play Store
pero bueno
ahora que va a bajar
el precio de la Play Store
igual les da más igual
no lo sé
no lo sé
son súper potentes
son súper interesantes
pero luego al final
parece que se pegan
un tiro en su propio pie
también luego a Apple
no le interesa
absolutamente nada
lo cual hace que
pillar de interés
sobre todo en dispositivos
iPhone
bueno
pues lo que os quería comentar
que es súper interesante
que tenéis que empezar
a saber
de qué trata esto
aunque todavía queda
bastante tiempo
¿vale?
no creo que sea importante
en
en todos los casos
pero
hay
una nueva cosa
que van a ir sacando
que es el tema
del User Agent
que lo van a ir reduciendo
¿vale?
el User Agent
la información que tenemos
en el User Agent
a día de hoy
o sea
hacemos
Navigator
punto
User Agent
¿vale?
toda esta información
normalmente
muchísimas veces
hemos utilizado
el User Agent
para saber
el dispositivo
del usuario
la versión del usuario
un montón de cosas
del usuario
¿vale?
bueno
pues esto va a cambiar
esto va a cambiar
poco a poco
¿y qué va a pasar?
pues lo que va a pasar
es que poco a poco
mucha información
que vamos viendo aquí
va a desaparecer
por ejemplo
pues va a desaparecer
la versión del usuario
de hecho
ves que tiene
demasiados detalles
pues esto va a ser cero
esto será cero
y al final
solo podrás saber
la mayor
lo mismo aquí
con lo de Safari
y este también
587 punto
esto será cero
aquí también cero
y aquí igual
10.15.0
o sea
empezará a ir perdiendo
¿vale?
aquí lo podéis ir viendo
a ver si sale por aquí
User Agent Redaction
ya es una cosa
que se ha ido comentando
pero vais a ver
que va a pasar
de forma paulatina
aquí podemos ver
que la primera fase
a partir del 2021
ya empieza a haber
warnings
cuando intentáis
acceder
a alguna información
a User Agent
a la versión
de la app
a la plataforma
luego la siguiente fase
que es la que está pasando ahora
en donde
hay páginas
que van a poder
decidir
no enseñar
esta información
y a partir
del Chrome 100
lo que va a pasar
es que van a empezar
a perder información
¿veis?
va a poner la versión
0.0.0
vais a ir perdiendo
los motivos de esto
es un tema de privacidad
Alejandro
es un tema de privacidad
es la posibilidad
es que fíjate
al ser tan detallista
a día de hoy
el tema
es que tú podías
cruzar
de hecho
es que es una cosa
que pasaba
que sabiendo
la localización
sabiendo cuánto
le queda de batería
a un usuario
y sabiendo
todo esto
podías asegurarte
sin trackear
sin tener una cookie
podías más o menos
saber
qué usuario
era el que volvía
o sea
es una cosa
muy loca
también de la batería
lo han arreglado
bastante
navigator
punto
battery
get battery
bueno
yo no tengo
battery
pero
con la batería
anteriormente
podías saber
un montón de información
aquí
que ahora ya
pues van quitando
podías llegar a saber
con demasiado detalle
cuál era el estado
de la batería
y cruzando datos
al final
podías llegar a saber
un montón de cosas
así que bueno
lo que quieren hacer
es como
ofuscar esta información
para poco a poco
para que no sepas tanto
pero ya ves
que todavía queda
porque esto ocurrirá
del todo
para Chrome
113
creo que aquí sale mejor
ves aquí se ve un poco
el rollout
y aquí podemos ir viendo
cómo va
va a ir pasando esto
ves
vas a ver
unified platform
ya no vamos a saber
quién ha hecho la CPU
un montón de cosillas
así que
bueno
que lo tengáis en cuenta
porque a día de hoy
mucha gente tira de esto
ves aquí vemos un ejemplo
0, 0, 0
luego la fase 5
pues ves
en Windows NT
pues vas a ver
10.0
aquí lo de Android
pues no verás
tanta información
sobre quién es
el fabricante
poco a poco
se va a ir perdiendo
cada vez más
información
básicamente
información que antes
se utilizaba
no va a haber forma
a ver
vais a poder
el user alien
no va a desaparecer
como a tal
lo que va a desaparecer
es
toda la información
que ahora mismo
tiene el user alien
que es demasiada
eso es lo que va a desaparecer
¿vale?
eso es lo que va a ir apareciendo
de forma paulatina
hola Midu
soy DevOps
y quería saber
si conoces algún creador
de contenido
que haga algo similar
a lo tuyo
de DevOps
ni idea
la verdad
ofuscar es ocultar
sí
ofuscar es
hacer que sea difícil
ver algo
mira de hecho
justamente
también tengo una cosa
pendiente aquí
que era el JavaScript
ofuscator
que en realidad
esto es bastante
antiguo
no sé si lo conocíais
pero esto es bastante
antiguo
que el JavaScript
ofuscator este
lo que viene a hacer
es intentar
y digo intentar
porque es que
ofuscar el código
JavaScript
lo que tú haces
es que tú tienes
este código
y lo que haces
es intentar
ofuscarlo
y fíjate lo que hace
¿vale?
fíjate lo que hace
para ofuscarlo
esto obviamente
yo no lo recomiendo
¿vale?
no lo recomiendo
absolutamente nada
porque esto
tiene un impacto
en la performance
es importante
fijaos
los topparseins
y tal
la idea de esto
lo que hace
justamente
es que no puedas
aunque tú tengas
acceso al código
no puedas ver
lo que hace el código
realmente
pero bueno
esto sería
ofuscar el código
hacerlo
no legible
esto
esto es bastante
antiguo
no es una cosa
que sea nueva
ni nada
pero bueno
estaba en la
JavaScript
weekly
en la newsletter
y he dicho
pues lo vamos a echar
un vistazo
y está bastante bien
porque
o sea
es curioso
como la estrategia
que sigue detrás
para conseguirlo
fíjate
un código
que es este
este código de aquí
en que lo transforma
o sea
es que es una
brutalidad
obviamente
de nuevo
esto no es recomendable
para un montón de cosas
porque
aparte de que el código
es mucho más grande
mucho mucho mucho
mucho más grande
es mucho más lento
tiene un montón de
problemas
no es recomendable
pero yo que sé
hay veces
que hay gente
que por lo que sea
pues dice
no esto sí
no quiero que lo vea nadie
y tal
sí seguro que la mitad
de las consultorías
siguen usando ofuscadores
totalmente
totalmente
a día de hoy
yo creo que no
tiene mucho sentido
incluso aunque uses
un ofuscador como este
al final
de una forma u otra
te van a
te van a poder
de ofuscar
de alguna forma
el código
vale
igual no
podrá ver
el nombre de las variables
no sé qué
no sé cuánto
pero bueno
es una tontería
pero es que para hacer esto
pues ya tienes
Terser
Terser hace exactamente
lo mismo
no hace lo mismo
o sea quiero decir
lo mismo
que al final
puede lograr alguien
que es el hecho
de que
bueno
pues quita los nombres
de las variables
te lo minifica
y hace que sea
mucho más difícil
de leer
o sea te falta
como
la semántica
del código
yo creo que
a día de hoy
con Terser ya es suficiente
porque
con un ofuscador
al final lo puedes
intentar de ofuscar
y puedes conseguir
un código
bastante parecido
al
debe haber
uno de fosco
claro
claro que lo
hay de aborder
claro que sí
si hay un ofuscador
hay un de ofuscador
totalmente
así que no
no es muy interesante
en ese aspecto
y para finalizar
otra cosa que he visto
que le tengo muchas ganas
lo que pasa es que
tendría que sacar tiempo
a algún lado
un nuevo motor
de
de juegos
que está especializado
en
en juegos
2D
vale
se llama
Lidl
JS
y habla
como que tiene
bastante
bastante
bastante buena pinta
de rendimiento
mira puede renderizar
10.000 objetos
a 60 frames
y bueno hay aquí
algunos ejemplos
y tal
y a ver
para que lo veamos
creo que hay una demo
mira Stress Out
donde podemos ver un poco
hostia
el ruido
mierda
fuera sonido
bueno podemos
ponerle un montón
de sprites
que está en movimiento
y podemos ver
que va a 60 frames
hostia que miedo
me ha dado el
si el screamer
no veas
bueno pero que va
bastante
bastante fino
parece
espero que no me pete
ahora de repente
a ver también es verdad
que esto habría que probarlo
en un móvil
habría que probarlo
si no la compresión
de Twitch
debe estar alucinando
debe estar flipando
pero bueno
que va bastante bien
mira y lo puedes hacer zoom
bueno me parece interesante
porque se ve muy fácil
de utilizar
fíjate
tú lo que haces
es crear
utilizando la librería
obviamente
y tendrías como
5 métodos
son 5 métodos
game init
game update
game update post
esto sería casi como un hook
game render
y game render post
esto es pues que
una vez que se inicia
esto que se llama
para cada frame
en los 60 frames por segundo
pues para ver
el input del usuario
para actualizar
el estado del juego
esto después
de que las físicas
y los objetos
son actualizados
pues para mover la cámara
para hacer cosas así
para renderizar
obviamente
y esto justamente
después de renderizar
para dibujar efectos
o lo que sea
pero bueno
me ha parecido
curioso
y mira
esto es
es bastante
es que me ha gustado
porque
me ha recordado un poco
a un poco
a la idea más
es que React
mira voy a hacer una cosa
que es bastante curiosa
pero React
una de las cosas que tiene
que fueron muy novedosas
fue tratar
la interfaz del usuario
como si fuese un videojuego
y eso
eso fue muy muy muy inteligente
¿sabes?
el hecho de
ser declarativo
el hecho de
de pensar más
en
cómo tenía que
¿sabes?
el cómo tenía que mostrar
la UI después
y
y tener el método render
los cambios de estado
y tal
es bastante curioso eso
y es lo que
realmente hizo triunfar
a React
así que
bueno
esto es lo que me
me ha llamado también
la atención
de este
es también
esa facilidad
y de hecho
hay un juego
que es este
Space Huggers
Space Huggers
o sea
abraza
gente del espacio
que abraza
a ver
bueno no tiene ruido
bueno no tiene audio
pero esto
este
está hecho
con el
con ese motor
mira mira
ahí puedes ir rompiendo
y la verdad
es que está bastante chulo
y os tengo que
reconocer una cosa
un
un sueño mío
frustrado
es hacer un videojuego
aunque sea una chorrada
pero siempre
siempre he tenido
muchísimas ganas
de hacer un videojuego
y nunca lo he hecho
y he pensado
hostia pues este motor
se ve
se ve curioso
a ver para hacer alguna chorrada
si si tengo el audio desactivado
porque no os quiero
no os quiero molestar
es que
bueno este
tampoco es tanto
este está bien
es que el audio anterior
era una mierda
y he pensado
oye pues podríamos hacer un juego
y podríamos intentarlo
con este motor
no se que os parece
a ver algo sencillo
hostia
me han matado otra vez
algo
algo sencillo
así que salga también
de izquierda a derecha
este por ejemplo
es
es sencillo y tal
eso si os aviso
yo no he hecho un juego
en mi vida
o sea no tengo
ni puñetera idea
por lo tanto
por lo tanto
vais a tener que tener
paciencia
de como lo hago
y que voy a fallar bastante
pero bueno
un juego así
sencillo
que se pueda jugar
y
con tres sprites
que sean 2D
yo si hago
algo así
madre mía
es que vamos
me vuelvo loco
uy ese me está esperando
ahí como una rata
ese me está esperando
ahí
a ver a ver
le voy a pillar
le voy a pillar
me voy a poner por aquí
ojo
ojo que tiene granada
hostia
hostia que chulo
el efecto
me está encantando
el juego este
viciado ya
mira mira
muerto
hostia ha salido disparado
ha salido disparado
bueno esta
si
un remake
del sandreas
mira el sandreas
pues lo he pensado
estáis conmigo
hacemos un juego
me daréis ideas
a ver
no se
está faser
que es bastante conocido
pero este me ha parecido
interesante
parece fácil
el código de este juego
que os acabo de enseñar
está totalmente disponible
nos podemos
copiar
o sea no copiar
se nos podemos inspirar
ver como se hace
y bueno
a lo mejor incluso
si el juego más o menos
sale bien
lo podemos sacar
como
con electrón
¿sabes?
para que se pueda utilizar
fácilmente
desde cualquier sitio
desde un
un ordenador
no se
me ha parecido interesante
me ha parecido interesante
Unity he intentado
aprender alguna vez
y nunca me ha
al final
porque a mi
lo que me gustan más
son los juegos en 2D
y es verdad que
cuando yo intenté aprender Unity
el 2D todavía
estaba bastante regular
había muchos fallos
y tal
estaba
no estaba ni en beta
todavía
era bastante complicado
pero bueno
que si os parece
le voy a dar una estrellita
Lidl
JS
y haremos eso
¿vale?
haremos un jueguecillo
no sé el qué
igual podemos hacer
primero un rebotes
así que parece fácil
el rebotes
¿no?
a ver
examples
screenshot
no sé si estará por aquí
examples
breakout
el breakout
debería ser fácil
pero podríamos intentar
hacer el breakout
el breakout
y a lo mejor
le podemos poner
mira se ve fácil
o sea no se ve muy complicado
o sea con todo
con esta línea de código
que vemos aquí
se han hecho el breakout
a ver si está por aquí
el breakout
bueno
a ver
no es el
el juego más apasionante
del mundo
pero podríamos hacer
que sea de disparos
también
no sé
alguna cosa así
alguna cosa así
ah mira ahí
ahí con sprites
ahí
esa es la idea
esa es la idea
meter sprites
algún sprite
bueno este veo que no funciona
sprite resource
no tira
bueno pues eso
amigos
mañana es la nextgsconf
espero verte aquí
porque vamos a estar en directo
con la conferencia de nextgs
que hace 5 años
que se lanzó nextgs
no sé si lo sabíais
cumple 5 años
mañana lo que vamos a estar en directo
mañana lo que vamos a estar en directo