►
Description
No description was provided for this meeting.
If this is YOUR meeting, an easy way to fix this is to add a description to your video, wherever mtngs.io found it (probably YouTube).
A
Your
thing
all
right
so
hi,
I'm
Colin
from
Shopify
and
just
going
to
talk
a
little
bit
about
our
experiences
with
early
hits
and
some
of
the
lessons
that
we've
learned
along
the
process
and
some
of
the
editorial
as
well
I'll
show,
at
the
end,
just
a
reminder
that
the
information
I'm
sharing
with
the
data
I'm
sharing
today
should
be
used
for
any
investment
or
financial
insights.
The
data
is
a
function
of
some
sampling
so
for
illustrations.
A
Only
that
so
early
hints
great
stuff
that
during
Black
Friday
Cyber
Monday
last
year
in
2021,
we
saw
through
synthetic
testing
page
improvements
for
our
Merchants
across
across
the
base
and
any
aggregate
sense
over
500
milliseconds,
faster
LCP
at
the
p50
when
we
enabled
early
hits
and
through
that
so
a
great
success.
Thank
you
very
much.
We'll
use
the
rest
of
this
time
to
look
at
dogs
all
right.
So
let's
talk
a
little
bit
about
the
the
problem.
I
appreciate
the
sympathy,
laughs.
A
The
one
of
the
core
challenges
that
we
have
is
with
our
Merchants:
they
can
build
websites
from
off-the-shelf
components
to
full
design
of
their
store
experience
and
in
many
of
the
cases,
if
not
all
the
cases,
we
have
this
classical
challenge
of
head
of
line
blocking
where
resources
are
discovered.
After
payload
is
loaded,
many
cases
requiring
that
TLS
tax
to
be
paid
as
TCP
connections.
A
The
TLs
connections
are
renegotiated
and
then
follow
on
resource
discovery
of
the
browser
loads,
leading
leaving
a
large
gap
of
time
where
the
browser
isn't
as
efficient
as
it
ought
to
be.
A
And
why
do
we
care
a
lot
about
this?
Just
to
you
know,
put
yet
another
data
point
to
everyone's
I
mean
I,
don't
think
anyone
here
needs
to
be
convinced,
but
for
us
that
first
engagement
is
a
Paramount
importance,
because
we
have
seen
when,
on
average,
that
first
page
experience
for
the
buyer
is
when
it's
10
faster,
then
there's
a
seven
percent
increase
in
conversion,
so
so,
like
the
first
page,
experience
is
important
in
the
long
journey
of
the
of
user
experience
for
completeness
sake.
A
You
know
there
have
been
past
attempts
at
filling
that
Gap
with
resources
getting
the
browser
to
know
what
to
do
sooner.
Of
course,
we've
gone
through
H2
push.
Please
don't
do
YouTube
searches
with
my
name
and
H2
push
and
result,
and
obviously
this
challenge
is
the
H2
push
that
we're
well
explored
with
cash
and
integration
challenges.
A
Resource
hints
have
been
better
because
it
integrates
it
into
HTML.
Markup
is
great,
but
the
mileage
does
depend
on
how
discoverable
the
resource
is
to
the
renderer.
Many
of
the
cases
and
I'll
talk
about
this
a
little
bit
at
the
end,
where
we're
competing
with
the
renders
thread
discovering
the
resources,
and
so
the
mileage
really
is
more
beneficial
when
it's
an
indirect
resource,
and
so
it's
a
lot
of
developer
implications.
A
The
yeah
I,
don't
just
for
anybody.
Who's
not
familiar
with
early
hints,
is
just
intend
to
be
an
HTTP
103
response
that
ahead
of
the
actual
200
response,
so
that
the
browser
can
get
a
jump
on
making
requests
for
CSS
and
JavaScript
in
that
in
between
time.
A
So
some
of
the
challenges
that
we
had
going
in
I
know
it's
been
said.
In
other
context,
but
I
think
HTTP
headers
are
hard,
so
adding
the
the
link
header
is
hard
and
adding
an
HD.
Another
HTTP
status
is
also
hard
and
there's
multiple
layers
to
that
part
for
developers,
inside
of
infrastructure,
so
on
the
on
the
platform
side,
but
also
for
more
specifically
for
our
developers,
so
the
developers
in
our
the
Shopify
larger
ecosystem,
the
entrepreneur
developer,
adding
HTTP
headers,
is
notoriously
challenged.
A
Complicating
is
also
how
do
you
relay
HTTP
103
through
a
CDN,
because
if
it's
a
shared
TCP
connection
on
the
back
hall,
how
does
a
103
response
reflect
out?
Is
it
for
one
of
the
responses
that
this
connection
is
established
for,
or
is
it
for
all
of
the
connections,
and
that
relaying
is
a
notorious
Challenge
and
then,
of
course,
browser
support
for
http
103.
A
additional
challenges,
specifically
on
the
the
Shopify
side,
I
call
it
technical
debt,
you
know
best
practices
that
pre-existed,
specifically
the
use
of
a
static
resource
domain
for
all
of
our
JavaScript
and
CSS.
So
we
use
cdn.shopify.com
as
a
separate
resource
Cookie
list
resource.
A
That
was
the
best
practice
in
the
old
days
and
has
been
built
on
over
the
last
15
years
and
unwinding
that
has
non-zero
amount
of
effort,
as
I
mentioned
earlier,
our
Merchants
can
build
content,
build
sites
highly
Dynamic
and
personalized,
so
it's
not
cachable
in
the
first
place
and
there's
you
know
varying
levels
of
control,
depending
on
where
you
are
on
that
ecosystem
of
our
of
our
ecosystem
of
developers,
whether
you're
providing
an
app
or
actually
building
the
whole
site,
so
just
to
run
through
the
quick
implementation
on
the
Shopify
side.
A
What
we
ended
up
being
able
to
do
is,
instead
of
exposing
apis
to
add
headers
or
add
the
HTTP
103
response.
We
focused
on
developing
apis
that
implicitly
added
the
Rel
preload,
both
in
HTML
markup,
but
also
as
the
HTTP
header.
The
intention
is
that
we
want
to
give
developers
the
tools
to
accomplish
the
outcomes.
They'll
add
a
hero,
image,
add
style
sheets
and
Signal.
A
What
their
intention
is
and
use
that
signal
to,
then
you
know
adding
an
image
tag
and
using
that
to
add
the
the
link
real
reload
in
both
the
markup
or
https.
A
We
also
globally
added
the
Rel
equals
pre-connect.
So,
whether
you
change
the
markup
or
not,
we
also
added
Rel
pre-connect
for
the
link
header
and
also
as
a
side
note
here.
We
also
Limited
the
the
use
of
of
hosts
for
preloads
in
that
We've,
and
this
is
partly
in
the
initial
implementation
uncertainty
of
like.
A
What's
the
implication,
so
we
wanted
to
scope
it
down
to
limit
it
to
pre-loading
resources
that
were
hosted
on
Shopify
resources
are
not
third
parties
and
and
so
forth,
and
also
limited
the
number
of
preloads,
which
is
also
in
the
initial
step
and
has
has
been
changed
so
to
achieve
this
kind
of
markup,
the
link
header
in
HTML.
These
are
the
kind
of
syntaxes
that
you
would
see
so,
for
instance,
at
the
last
one
here,
if
we
wanted
to
put
his
a
web
font,
Market
is
an
asset.
A
Url
Mark
is
a
preloaded
font
or
the
middle
one.
Mark
it
as
an
image
tag
and
that
image
tag
would
actually
emit
the
HTML
image
tag,
but
also
add
the
preload
HTML
and
the
preload
link
header,
so
keep
the
context
within
the
markup
with
the
intention
and
then
the
platform
will
take
care
of
it.
This
is
a
Snippets
of
example,
code
from
our
link,
a
liquid
language,
but
we
also
have
this
in
hydrogen
as
well
in
similar
fashions
on
the.
What
made
this
possible
was
in
the
cloudflare
integration.
A
A
This
is
this
solves
that
problem
of
integration
and
the
reflection
of
if
it
was
103
possible,
the
origin,
who's,
the
actual
Target
and
it
solves
the
problem
of
having
to
manipulate
and
manage
specific
code
in
the
CDN
I'll.
Mention
I'll
go
into
detail
a
little
bit
later
on,
but
also
we
had
to
isolate
this
to
http,
2
and
3,
as
well
as
doing
user
agent
detection
in
the
isolation.
A
So
instead
of
the
typical
use
case
of
the
while
three
and
content
coming
from
the
server
in
our
CDN
environment,
we
have
that
first
request,
so
the
get
going
through
the
CDN
going
to
our
backend
origin
and
that
link
header
on
that
first
200
request.
A
Coming
back
on
the
second
request
that
link
header
being
generated
and
cached
results
in
the
103
response
and
the
way
you
go
so
that's
that
solved
the
integration
with
cloudflare
and
the
Google
side,
m95
introduced
behind
feature,
Flags
early
hints
and
subsequently,
with
a
bunch
of
other
fixes
in
m97,
ahead
of
Black
Friday
with
a
field
trial
through
Black
Friday.
We
were
able
to
enable
this
feature
flag
and
that's
where
all
all
of
our
data
that
we
gathered.
A
So
it's
a
ability
to
do
AV
comparison
into
cohorts,
it's
a
notable
notable
failures
in
this
process.
So,
first
off!
Oh,
you
can't
see
this.
So
we
enabled
this
originally
just
scope
to
https
and
thinking
that
that
will
eliminate
the
problems
of
middle
boxes
and
things
like
that
turns
out.
There
are
proxies
everywhere,
and
these
proxies
all
share
code
that
akin
to
this
one.
This
is
from
Mod
proxy.
This
can't
read
small
space,
but
there's
a
giant
fix
me.
A
That's
highlighted
at
the
bottom
and
this
code
comes
from
like
early
2000s.
It
was
basically
I.
We
don't
know
how
to
deal
with
100
Series,
so
we
just
Punt
and
we'll
just
return
the
payload
as
it
comes,
and
this
broke
some
of
our
integration
partners
because
they
had
you
know
one
specific
case.
They
were
relaying
the
original
content,
doing
some
Transformations
for
the
merchant
and
then
sending
a
content,
and
now
they
were
getting
zero
body
payloads
because
of
mod
proxy.
A
We
found
the
same
thing
in
pretty
much
every
one
of
those
typical
proxy
stocks
that
might
be
used
and
also
has
very
similar,
feels
like
this
called
call.
This
code
was
copy
and
pasted
and
has
proliferated
for
20
years,
so
that
forced
us
to
isolate
the
the
use
of
early
hints
to
HTTP,
2
and
3
connections,
because
this
is
you
know
these.
This
snippet
particularly
doesn't
apply.
It
only
works
in
HTTP
one
connection
scene.
A
We
also
ran
into
challenges
with
Lighthouse
as
an
example
because
of
the
version
of
Chrome
that
it
was
attached
to.
It
was
running
the
same
thing
where
the
lighthouse,
the
inspector
was
basically
looking
at
the
First
Response,
seeing
the
zero
bytes,
because
the
103
didn't
have
a
payload
body,
and
so
it
also
had
failures
again.
So
this
is
why
we
had
to
start
using
user
agent
isolation
to
focus
it
onto
Chrome,
m95
and
later
in
this
scenario,
so
results
as
I
mentioned
great
results.
A
So
this
is
a
synthetic
of
Jim
shark,
where
you
can
see
the
movement
of
the
largest
contentful
paint.
This
is
a
you
know,
as
a
synthetic
you
know,
of
things
are
being
a
little
bit
exaggerated
here
for
illustration,
but
across
the
board
we
definitely
saw
that
movement
between
those
that
got
early
hands,
particularly
with
the
pre-connect
header,
comparing
that
with
the
the
Baseline
so
in
here
I've
got
an
aggregate
view
here
across
all
the
different
platforms
and
on
these
are
box
plots
so
plotting
the
P1
P99.
A
The
Box
itself
is
p7
2575
and
the
line
is
the
median.
So
across
the
board.
The
early
hints
cohort
definitely
saw
a
much
improved
LCP
in
that
p50
comparison
at
a
global
level
was
at
you
know,
500
milliseconds,
so
nothing
to
sniff
at
and
you
can
see
as
the
candlesticks
the
box
plots,
they
have
all
kind
of
increased.
A
There
was
a
challenge
here
in
how
we
collected
or
isolated
this
data
and
I'll
dig
into
that
a
little
bit,
but
we've
had
to
go
through
a
lot
of
extra
Hoops
just
to
be
able
to
help
isolate
the
two
cohorts
because
it's
unclear
and
from
first
blush
if
this
was
a
client
that
had
the
field
trial,
enabled
and
could
listen
to
early
hands
and
took
action
on
that
early
hints
in
the
word,
Quest
flow
before
I
dig
into
that
just
same
box
plots
copy
and
pasted.
A
You
know
they're
based
on
dip
and
jug
fees,
so
top
left
you
have
North
America
you've
got
Europe
and
Central
Asia.
So
if
you
look
at
a
continent
level
to
reevaluate
this
and
as
you
actually
look
at
it
in
more
Eastern
countries
and
and
continents,
you
definitely
saw
that
Improvement
and
LCP
much
greater
across
the
board.
So
so
good
results
across
the
the
interesting
piece
here
and
I'm
going
to
put
some
footnote
on
this
one,
because
this
is
the
time
to
First
Bite
plot.
A
So
look
at
China,
First
Bite.
We
also
we
saw
time
first
bike
actually
got
worse
now.
I
put
a
footnote
here:
I've
had
to
rerun
this
data
with
the
Insight
recently
about
response
start
being
triggered
by
early
hint.
So
this
data
is
not
as
accurate,
because
I
think
it's
more
of
an
a
to
a
but
looking
at
even
time.
The
last
byte
we
saw
similar
result.
So
that's
why
I've
left
it
in
here
where
the
time
to
last
byte
end
time.
A
The
first
bite
thought
slightly
worse
with
pre-connect,
oh
sorry,
with
the
early
hands,
but
measured
in
tens
of
milliseconds,
not
hundreds
of
milliseconds.
So
this
makes
some
sense
because
of
the
network
adapter
having
to
now
do
other
scheduling
on
the
the
the
wireless
plane
and
having
to
make
other
TCP
Connections
in
busy,
while
it's
waiting
now
getting
queued
up
results.
So
this
makes
you
know
intellectual
sense
and
at
the
cost
trade-off
of
delaying
by
10
20
milliseconds
in
exchange
for
500
milliseconds
I
was
definitely
a
good
trade-off.
A
Some
general
lessons,
though,
so
the
ecosystem
is
messy.
I
mentioned
this
because
of
Legacy
HD,
one
one
proxy
mod
proxy
particular,
but
also
all
of
the
copy
and
paste
of
modproxy.code.
A
We
had
to
isolate
that
to
http
two
and
three
So
to
avoid
that
UA
snipping
was
still
needed
because
of
Lighthouse
and
something
compatibility
even
where
there
was
HTTP
203
supported
to
date.
I
think
Lighthouse
is
the
only
major
example
where
this
was
that
we
identified,
but
you
know
we're
still
isolating
that
just
for
a
good
practice
today,
I
believe
it's
isolated
to
Chrome,
95
and
greater
curl
and
a
bunch
of
the
other
debugging
tools
as
exceptions.
A
There
were
some
inconsistencies
with
the
implementation
of
the
link
header,
particularly
like
image
source
set
image
sizes
because,
as
we
emit
the
link
header,
it
had
to
be
post-processed
by
CDN
and
then
emitted
out
later,
and
not
all
the
attributes
that
we
thought
were
were
being
aligned
and
exposed
and
the
you
know
the
questions
there
I
think
about
like
how
do
we
make
sure
this
is
consistent
in
the
rfcs
or
in
the
in
the
spec
for
the
link
header?
A
In
our
case,
we
do
believe
that
the
pre-connect
was
what
moved
most
of
the
gains
because
of
that
TLS
tax
at
the
front
that
we
saw
a
globally,
but
we
did
see
a
lot
of
different
adoptions
and
the
adoption
in
the
developer.
Community
was
pretty
wide
from
those
that
aggressively
just
added
preloads.
Once
we
opened
it
up,
they
added
preloads
for
everything.
A
It's
not,
unfortunately,
not
that
uncommon
as
well
as
we
had.
We
gave
a
mechanism
for
people
to
add
a
preload
as
a
handcrafted
saying
that
here's
a
resource
I
do
actually
want
to
mark
this
as
a
meta
take
for
preload,
and
we
saw
a
number
of
those
cases.
The
challenge
with
that,
of
course,
is
that
with
the
handcrafted,
particularly
they
get
quickly
out
of
sync
and
they,
you
know
it's
like
every
other
handcrafted
scenario
which
we're
trying
to
avoid
in
the
first
place.
But
of
course,
developers
do
take
advantage
of
that.
A
Credential
connections
continue
to
trip
up.
We've
had
to
deal
the
number
of
requests
or
concerns
about
this,
where
trying
to
pre-load
this.
But,
of
course
it's
on
a
credentialed
connection,
and
so
you
know
the
these
across
origin.
It's
a
continued
challenge
for
our
developer
ecosystem
so
and
that's
a
pretty
wide
ecosystem
out
there
and
of
course,
HP
priorities
definitely
proved
to
the
valuable
the
work
that
shipped
earlier
on
to
re-prioritize
resource
hints
to
make
sure
that
they
got
de-prioritized
ahead
of
once.
A
The
render
thread
goes
some
of
the
outstanding
issues
we
talked
about
this
I
think
two
weeks
ago,
response
start
is
ambiguous
and
I'm,
hoping
that
we
can
land
someone's
changes
to
make
response
start
more
consistent
with
previous
assumptions
that
response
to
it
was
when
the
authoritative
response
landed.
Obviously,
right
now
it's
a
little
ambiguous
and
and
the
current
implementation
of
Chrome
response
start
measures
when
the
early
hints
land,
which
is
what
I
mentioned
the
book.
A
It's
a
the
data,
a
little
messy
and
trying
to
tease
out
what
the
true
time,
for
spite
is
that's
kind
of
related.
Actually,
we
did
add
the
initiator
type
of
early
hints
and
to
the
resource
planning,
but
that
also
is
true
proved
to
be
a
little
bit
racy,
because
you
know
there
are
many
situations
where
it
would
just
say.
A
Initiator
type
is
link
instead
of
early
hints
and
that's
just
a
function
of
when
it
actually
landed
on
the
network
stack
and
some
Oddities
there
we'd
like
to
still
and
there's
still
some
conversations
that
no
one's
been
driving
about
sub
resources
and
worker
usage.
This
is
where
it
can
get
really
useful
when
you,
particularly
for
single
page
applications,
be
able
to
do
some
of
that.
Loader
loaders
signals
some
of
the
opportunities
for
early
hints
there,
and
the
last
two
items
here
is
the
browser.
A
Adoption,
obviously,
is
continue
outstanding
and
relate
to
last
conversations
about
the
reporting,
so
reporting
of
Orphan
requests
is
still
unclear.
How
do
we
get
these
orphaned
requests
because
this
code,
that
Merchants
can
deploy
to
Signal
the
early
the
signal
resource
sense
of
any
kind,
whether
preload
or
pre-connect,
that
could
be
embedded
in
loops
and
Fork?
So
we
can't
see
it
all
the
time
and
particularly
where
Merchants
have
tried
their
best
to
follow
whatever
YouTube
tutorial,
they're
doing
and
they've
just
High
encoded
a
bunch
of
stuff.
A
They
don't
get
the
feedback
loop,
that
they're
causing
the
buyer,
the
user
agents
actually
download
resources
that
are
never
used
as
the
adoption
is
is
so
that's
feedback
loop
would
be
nice
to
have
so.
Finally,
some
final
editorial
here,
as
we've
mentioned
a
number
of
times
already
resource
hands,
still
require
a
lot
of
context
and
development
developer.
Intention
like
it's,
it's
not
a
Silver
Bullet
by
itself
with
the
use
of
early
hints.
We
you
know
we
are
you
that
are
using
that
time
in
the
margin.
A
That
is
worked
as
undergoing
it's
15
years
of
architecture
that
needs
to
be
Unwound,
it
doesn't
happen,
and
so
the
I
think
the
the
most
beneficial
part
of
early
hints
that
allowed
us
to
create
a
new
compensate
and
control
that
allowed
us
to
get
some
of
the
performance
gains.
While
we
buy
time
to
rebuild
and
re-architect
this
kind
of
philosophy,
I
want
to
encourage
the
community
to
do
more
of
where
we
can
get
around
some
of
the
the
old
bugs.
A
If
you
will
well
addressing
that
yeah,
the
right
solution
is
to
blow
it
up
and
rebuild,
but
we
could
make
strides
in
between
time
and
that's
all
I've
got
so.
Thank
you
very
much.
Let's
look
at
more
belts.