►
Description
SharePoint PnP Community - SPFx & JS SIG call on July 30. Three demos: 1) App Insights Dashboard with React based web parts, 2) Fast Serve with SharePoint Framework – speed up the bundling process, and 3) Workbench customizer for improved debugging experience. Open-source project updates include: Released PnPjs Client-side Libraries v2.0.7 (and v2.0.8 scheduled for Aug 7), Office 365 CLI – Beta v2.13 and Preview V3, React Controls v2 beta, React Property Controls v2 beta, SPFx Generator v1.15. 4 new, 2 updated SPFx Samples delivered in last 2 weeks. The host of this call was Patrick Rodgers (Microsoft) @mediocrebowler. Q&A takes place in chat throughout the call.
Demos:
• App Insights Dashboard with React based web parts – Sudharsan Kesavanarayanan (NTT) | @sudharsank
• Fast Serve with SharePoint Framework – speed up the bundling process – Sergei Sergeev (Mastaq) | @sergeev_srg
• Workbench customizer for improved debugging experience - Joel Rodrigues (Storm Technology Ltd) |@JoelFMRodrigues
Learn more:
• See the full blog post for this call at: http://aka.ms/spdev-blog.
• Download invite for bi-weekly SharePoint Framework call at: https://aka.ms/spdev-spfx-call
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos
A
Welcome
to
the
sharepoint
framework
and
javascript
special
interest
group
bi-weekly
sync:
it
is
july
30th
2020
very
excited
to
see
everybody
back
here
on
the
call.
So
we've
got
a
great
agenda
as
usual
this
week,
so
we've
got
updates
on
sharepoint
framework.
We've
got
updates
across
the
patterns
and
practices
program.
A
First
of
all,
I
really
encourage
everybody
if
you've
worked
on
something
awesome
for
your
customers
or
your
company
demo
it
if
you
can
demo
it
if
it's
demo-able
in
the
sense
that
you
know
it's
okay
for
the
world
to
see
it.
It's
not
some
secret
internal
thing
reach
out
to
us.
We'd
love
to
get
you
scheduled
on
a
call.
There
could
be
web
parts
application
customizers.
A
Love
love,
love
all
the
great
demos
we've
had
over
the
years,
and
they
just
I
keep
keep
getting
better
contributing
to
github,
always
encourage
you
to
contribute
to
any
of
the
pnp
projects.
You
can
always
report
issues.
We
very
much
appreciate
that
so
always
encourage
you
on
github
to
join
in
report
issues.
We
don't
love
that
there
are
issues,
but
we
love
hearing
about
them,
so
we
can
get
them
fixed
and
addressed.
You
can
always
submit
pull
requests.
All
our
projects
absolutely
welcome.
A
Your
pull
requests,
and
I
know
a
lot
of
the
projects
are
working
on
updating
their
contributor
guidance
to
help
make
that
process
a
little
bit
easier
as
well.
If
you
have
some
time,
you
can
always
help
out
with
issues
and
questions
other
folks
might
have
in
the
issues
list.
That's
always
a
great
way
to
help
out
and
contribute.
Finally,
you
can
always
provide
feedback
about
all
the
things
we
do.
So
how
are
these
calls?
How
is
our
documentation?
A
Where
can
we
help?
Positive
feedback?
Is
okay
too,
and
I
would
just
also
suggest,
especially
for
like
documentation
feedback.
It
really
helps
if
you
could
point
to
kind
of
a
concrete
area
or
concrete
suggestion
about
making
the
documentation
better.
We
get
a
lot
of
kind
of
comments
about.
Oh,
your
docs
should
be
better
and
I
don't
necessarily
disagree,
but
helping
us
understand
how
they
could
be
better,
really
helps
us
make
those
changes
and
make
things
better
for
everybody.
So
moving
on.
A
So
lots
of
great
resources
to
point
you
towards
here,
so
microsoft,
365,
developer,
videos,
that's
our
developer
youtube
channel!
Those
are
some
more
developer,
focused
videos.
We've
got
the
pnp
video
channel,
that's
m365,
pnp
videos,
that's
our
youtube
channel!
So
that's
all
our
community
calls
all
of
our
monthly
calls
and
a
lot
of
other
great
content
around
sharepoint
framework
and
sharepoint
development.
All
up
we've
got
a
whole
ton
of
open
source
repositories
that
you
can
check
out.
Report
issues
participate
with
pull
requests
and
other
work
help
people
out.
A
A
A
A
There
is
a
great
series
called
sharing,
is
caring
put
on
by
david
warner
and
there
are
a
whole
host
of
sessions
here
so
august,
21st,
24th
and
26th
and
you've
got
doc
sessions
july
31st,
then
august
3rd,
28th
and
31st.
So
you
can
always
register
today.
It's
free
down
there
at
the
link
on
the
bottom
aka.
Ms
sharing
is
caring,
so
check
that
out,
it's
a
great
way
to
get
started,
learn
how
to
contribute,
learn
how
to
contribute
to
the
docs
and
just
general
understanding
of
of
I
want
to
be
involved
in
pnp.
A
How
do
I
get
more
involved?
I
don't
know
where
to
start.
This
is
a
great
session
and
we're
super
excited.
We've
had
great
attendance
at
these
and
they've
been
going
really
really
well
and
folks
have
found
this
as
a
great
way
to
get
started
and
get
into
contributing
on
pnp
and
understanding
how
to
contribute
in
pnp,
so
love
seeing
that
grow
we
do
have.
I
don't
know
if
I'm
the
first
to
announce
this
in
a
call,
but
we
have
a
pnp
virtual
conference
coming
up
september
1st.
A
I
don't
have
many
more
details
right
now
to
share
other
than
it's
going
to
be
on
september
1st,
it's
going
to
be
virtual
and
it's
a
pnp
conference,
so
pnp
virtual
conference
register
for
that
it's
free,
it's
gonna,
be
all
kinds
of
pnp
content,
microsoft,
365
development
content
and
it's
gonna
be
put
on
by
the
community
for
the
community,
so
certainly
encourage
folks
to
to
think
about.
You
know
attending
that.
A
So
I
I
just
don't
have
any
more
to
share
right
now,
other
than
we've
got
a
date,
and
we
look
forward
to
putting
this
on
for
the
community
and
it'll
be
hosted
by
a
lot
of
folks
from
the
community.
So
sharepoint
framework
updates,
normally
I'd
pass
things
off
to
vasa,
but
he
is
on
vacation
somewhere
up
in
northern
finland.
I
suppose
so.
I
will
be
doing
these
updates
today.
So
sharepoint
framework
v
1.11
is
out
and
available
more
great
integration,
with
microsoft
teams
and
as
well.
A
You
can
now
publish
your
apps
to
the
store,
so
if
your
company
has
an
app
that
they'd
like
to
perhaps
in
the
past,
has
been
being
side
loaded
and
things
like
that,
you
can
now
get
these
things
into
the
store,
and
I
certainly
encourage
folks
to
look
at
that
as
a
great
model
to
get
your
apps
published
and
get
your
app
sold
to
folks
questions
on
that.
Obviously,
let
us
know
issues
with
that.
Obviously
let
us
know
you
know
ways
it
could
be
improved.
A
Obviously
let
us
know,
but
it's
a
great
great
start
and
encourage
you
to
get
your
apps
published.
Look
at
that
process
and
you
know
it's
a
fantastic
way
to
kind
of
get
yours
get
your
work
out
there
into
the
world
and
available
to
more
people
to
easily
add
into
their
sharepoint
sites
or
into
their
teams.
A
Sharepoint
framework.
We've
got
a
bunch
of
great
partners
in
the
store
already
so
there's
a
preview
program
for
the
store.
So
we
worked
with
lightning
tools,
hyperfish
rencor
office
at
work
and
sharepoint,
a
list
on
some
initial
working
with
the
store
and
getting
some
apps
published
into
the
store.
So
I
want
to
thank
those
partners
for
working
with
us
in
that
preview
program.
You
can
check
out
their
apps
in
the
store
and
look
forward
to
other
folks
getting
their
apps
in
the
store
as
well.
So
thank
you.
Thank
you.
A
Thank
you
for
everybody.
Helping
out
with
that
preview
program,
very
much
appreciate
the
time
and
effort
that
went
into
the
work
there
and
then.
Finally,
I
just
want
to
do
one
more
reminder
of
these
great
microsoft
teams,
samples,
there's
some
some
great
ones
in
there
now
we'll
be
adding
more
ones
as
we
get
going,
but
if
you're
looking
at
how
to
start
doing
teams
development
with
sharepoint
framework,
which
is
slowly
morphing
into
kind
of
a
microsoft
development
framework,
you
can
push
that
stuff
into
teams
now
as
well.
A
We've
got
lots
of
great
samples
on
how
to
do
that.
So
do
check
that
out
at
dot.
Ms
slash
teams
dash
samples
and
that's
from
us,
microsoft
samples
as
well
as
community
driven
samples
for
you
to
have
a
look
at
take
advantage
of,
and
then
you
know,
learn
from
as
well
how
to
do
these
great
new
teams
integrations
that
are
available
to
you,
so
pmpjs,
client,
side,
library
updates,
so
2.0.7
was
released
on
monday
july
27th,
it
was
supposed
to
be
on
friday,
ended
up
being
released
on
monday.
A
That
was,
I
had
some
family
stuff
happen
friday
that
I
needed
to
attend
to
so
push
that
out,
but
that
is
now
out.
We've
got
the
msal
client
is
in
there
updated
an
entire
section
on
authentication
documentation
so
so
check
that
out.
Hopefully,
I've
made
that
a
little
bit
more
clear
and
that's
something
we're
going
to
be
trying
to
do
with
the
documentation.
A
We've
got
a
whole
new
section
on
contributing
coming
that'll
come
with
the
2.8
release,
and
then
we
got
a
ton
of
great
issues,
not
great
issues,
but
a
ton
of
great
resolutions
to
issues
I
should
say
as
well.
In
the
207
release,
208
release
is
still
scheduled
and
on
track
for
august
7th,
so
that'll
be
out
very
shortly
and
we'll
have
some
some
more
stuff
in
there
for
everybody
getting
started
with
pmpgs
video
series,
understanding
extension
methods,
video
is
out.
You
can
find
all
those
videos
in
our
youtube
channel.
A
There
is
a
pnp
js
v2.
I
forget
what
youtube
calls
it
playlist
playlist,
so
you
can
see
all
those
videos
you
can
also
start
following
the
m365
pmpjs
twitter
account
we're
gonna
start
trying
to
use
that
more
and
more
to
push
out
our
updates
and
take
it
a
little
bit
off
of
just
like
me
publishing
the
update.
So
you
can
still
follow
me,
but
m365
pmpjs
will
be
the
official
account
for
updates
around
pmpgs
as
we
move
forward
and
then
just
one
final
reminder
all
feedback.
A
We
welcome
love
feedback.
Please
send
it
to
the
issues
list,
there's
just
too
many
other
channels
in
the
world
across
twitter
and
forums
and
email
and
everything
else.
Of
course,
all
the
teams
channels
there's
just
too
many
of
those.
So
if
you
have
feedback
have
issues
have
questions.
Please
use
the
issues
list
that
just
means
we,
we
won't
miss
it.
We
won't
forget
about
it
and
we
could
track
it
to
proper
resolution.
A
B
Yep,
okay,
thank
you,
patrick
okay,
so
the
latest
version
of
the
cli
is
is
now
out
there
2.13,
so
we've
got
all
hosted
new
commands
in
there.
Some
some
updates
to
our
sharepoint
project
upgrades.
So
we've
seen
some
improvements
to
the
new
code
tour
report
that
allows
you
to
interactively
go
through
steps
in
visual
studio
code
to
upgrade
the
different
elements
of
your
projects.
To
get
there,
get
your
projects
up
to
date,
which
is
a
really
cool
feature
that
we're
really
interested
to
see
and
get
feedback
on.
B
So
we've
obviously
got
the
sharepoint
framework
doctor
out
there
as
well.
If
you
have
used
that
and
you've
got
your
feedback
again,
please
let
us
know,
and
so,
if
you're
not
aware
of
what
the
spfx
doctor
is,
is
it's
an
easy
way
to
just
check
your
environment
to
make
sure
that
you've
got
all
the
dependencies
required
to
run
your
the
project?
B
We've
recently
actually
been
bundled
into
the
azure
cloud,
shell
now,
and
so,
if
you're
using
the
azure
portal
using
as
your
cloud
shell,
you
don't
actually
have
to
install
the
cli
it's
there
by
default
for
you
to
use
now,
which
is
which
is
really
cool.
We've
also
released
a
version
three
of
the
cli.
This
is
just
in
preview
and
this
is
to
help
you
get
ready
for
our
version,
three
that
we'll
be
releasing
later
in
the
year.
B
B
All
the
other
updates
to
version
two
will
be
releasing
regularly
through
our
twitter
account.
So
follow
us
at
office.
365,
cli
and
yeah
check
out
the
the
the
project
on
github
and
if
you
want
to
get
involved,
we've
got
plenty
of
issues
available
for
you
to
work
on.
If,
if
you,
if
you,
if
you
want
and
if
you
need
help,
obviously
we're
more
than
happy
to
help,
you.
A
All
right,
thank
you
gary
for
that
great
update,
appreciate
it
and
definitely
check
out
the
cli.
If
you
haven't
very
exciting
to
see
it
get
added
into
the
azure
cloud,
shell,
that's
a
really
cool
thing
for
that
to
be
there
so
reusable
controls.
I
believe
elio
or
alex
wanted
to
talk
through
this
hello.
C
Everyone,
so
it
will
be
ilio.
I
don't
know
if
alex
is
there,
but
alex
did
a
really
amazing
job
with
the
react
controls
and
the
react
property
controls.
We
can
now
announce
that
for
the
two
projects
we
released
a
version
2
beta
release.
What
does
it
mean?
We
want
to
move
forward
with
it,
so
we
want
to
start
using
the
latest
and
greatest,
like
reactive
version,
16
and
also
office,
ui
fabric
version,
6.,
we're
also
thinking
about
moving
forward
to
version
7.
C
That's
later
to
come,
it's
version
2,
which
means
that
it's
a
breaking
change,
so
v1
will
still
be
there.
If
you
are
using
on-premises,
you
can
still
use
the
v1
version.
V2
will
be
sharepoint
online.
Only
basically,
it
has
to
do
with
the
react
version
and
stuff
that
is
missing
in
the
older
builds.
So
beta
is
out.
Please
check
it
out.
C
A
Awesome,
thank
you
for
that
update
and
really
I
don't
want
to
undersell
the
amount
of
work
that
went
into
this
2.0
beta,
so
definitely
check
that
out.
Give
them
feedback
help
make
that
the
first
real
2.0
non-beta
release
the
best
it
could
be
so
try
that
stuff
out
send
in
some
feedback
report
issues
and
help
us
get
that
all
sorted
out.
So
I
think
I'm
talking
through
community
yeoman
generator.
A
So
if
you
haven't
tried
it
out,
spf
x
generator
for
community
built,
so
it's
built
on
top
of
the
out
of
the
box.
Sharepoint
generator
a
great
way
to
help
jump,
start
your
projects
with
a
lot
of
different
options,
but
at
the
end
of
the
day
you
get
a
quote-unquote
real
sharepoint
framework
project
latest
release.
115
adds
angular
10
support,
upgrades
spfx
to
1.11,
updates
the
typescript
compiler
and
updates
the
versions
of
the
pmpjs
and
controls.
A
A
If
you
have
questions
and
want
to
chat
about
your
questions
or
issues
or
whatnot
in
the
getter
channel,
and
then
modern
search,
no
updates
right
now
on
modern
search,
the
the
june
release
is
still
available
or
the
june
release
is
the
latest
that
is
available.
314-2
bug
fixes
and
certain
other
abilities
added
in
so
definitely
check
that
out.
A
We're
not
currently
accepting
prs
for
version
three
we're
kind
of
in
maintenance
mode
there
and
working
on
what
we're
gonna
see
for
you
know
what
what
the
next
version
is.
Gonna
be
version,
four,
what
that's
gonna
turn
into
so
definitely
have
a
look
at
this
for
your
modern
search
experience
great
way
to
create
a
search
center
right
out
of
the
box,
with
not
a
lot
of
extra
work
on
your
side
and
then
pnp
samples,
that's
gonna,
be
hugo,
wants
to
talk
through
that
have
a
shot.
D
D
So
we
have
some
new
extensions
or
one
new
extension
by
joao
mendez,
which
is
image
editor.
It
allows
you
to
actually
edit
images
from
within
the
library
changing
colors
filters,
all
sorts
of
cool
things
on
the
web
part
side.
We
have
a
couple
updates
from
peter
paul
kirschner
the
react
directory
webpart
that
was
originally
created
by
joao,
where
peter
made
a
fix
for
the
mock
service
for
workbench
and
then
the
react
image
gallery
also
originally
from
joao,
where
peter
paul
kushner
made
an
update
to
the
version
conflict
with
websocket
driver.
D
We
have
a
new
web
part
by
me.
It's
the
enhanced
powerapps
web
part,
which
you
know
takes
the
original
powerapps
web
part
the
out
of
the
box
powerapps,
but
it
adds
things
like
theme,
support,
dynamic
data
support
and
a
responsive,
responsive
resizing.
I
had
promised
april
dunham.
I
would
do
this
so
here
it
is,
then
we
have
a
new
manage
profile
card
properties
by
joao
mendes,
which
allows
you
to
actually
edit
a
user's
property
card
in
sharepoint.
D
So
if
you
want
to
add
custom
profiles
and
things
like
that,
that's
how
you
would
do
that
and
finally,
we
have
a
brand
new
web
part
from
ramen
ahmadi,
which
allows
you
to
shows
you
how
to
call
dynamics,
365
crm,
apis
to
show
content
in
the
page.
We
welcome
all
of
you
to
contribute
to
samples
and
those
samples
are
open
source
if
you
see
something
that
you'd
like
to
fix
or
update
in
the
samples
as
well
you're
welcome
to
do
this.
We
welcome
all
contributions.
Thank
you.
Everyone
back
to
you,
patrick.
A
Thanks
hugo
and
yeah
I
just
want
to
echo-
this
is
a
great
way
as
well.
To
get
involved
in
pnp
is
contributing
samples
again,
it's
a
great
way
to
contribute
a
sample
to
the
repository
and
then
demo
it
on
a
call
is
really
a
fantastic
way
to
sort
of
share
what
you're
working
on
with
the
community
sudharson.
Are
you
ready
to
go.
E
E
E
E
One
is
page
view
user
statistics
and
then
the
performance
statistics-
and
there
are
a
couple
of
filters-
are
provided,
which
is
a
time
span,
time
interval
and
the
date
range,
so
you
can
select
based
on
the
date
range
time
span
and
time
interval
and
for
some
of
the
reports.
Mostly
all
the
reports
are
using
custom
query.
E
Some
of
the
supporting
artifacts,
like
the
azure
rest
api
explorer
so
for
configuring,
the
schema
and
to
define
the
to
study
on
the
schema.
What
are
all
the
data
is
returned
and
what
are
all
the
properties
returns?
I
have
used
rest
api
explorer
and
I
have
also
gone
through
some
custom
query
document
and
then
created
a
query
and
used
spfx
controls
for
the
chart
and
you
can
find
different
kinds
of
chart.
Implementation
and
hugo
has
created
many
webparts
on
different
kinds
of
charts
and
next
is
azure
application.
Insights
report
templates.
E
E
So,
based
on
this,
you
can
call
the
rest
api
and
then
you
can
retrieve
the
data
and
then
you
can
present
it
to
your
users
so
and
there
are
a
well-defined
documentation
and
the
reference
you
can
see
all
the
documentations
and
other
kind
of
stuff-
and
this
is
the
overview
of
the
custom
query
where
you
can
see
a
detailed
explanation.
Some
of
the
samples
and
tutorials
and
the
other
artifacts
is
there
are
two
solutions:
extensions
available
where
it's
a
sharepoint
framework
extensions
which
will
help
to
add
to
update
azure
application
insights.
E
So,
whichever
page
you
are
accessing
based
on
the
user
logged
in
details,
so
this
one
is
a
simple
js
application,
app
insights,
which
will
add
the
relative
page
information,
and
this
is
a
app
insights
advanced
which
I
have
used.
This
is
a
which
will
handle
the
partial
page
postbacks
in
sharepoint
online
and
will
also
provide
us
custom
properties.
We
can
also
enable
the
custom
properties
while
adding
the
logs
to
the
application
insights.
E
So
let
us
move
on
to
the
demo,
so
this
is
so.
I
have
already
installed
the
sharepoint
framework
in
one
of
my
tenants,
so
this
is
a
dashboard.
This
is,
this
is
a
single
page.
This
is
a
dashboard
where
the
first
section
will
show
all
the
page
view.
Statistics-
and
these
are
all
the
filters
provided.
So
there
is
some
restriction
like
up
to
90
days
of
data
can
be
retrieved
from
azure
application
insights,
and
I
have
also
provided
the
time
span
so
based
on
the
selection.
E
So
you
can
see
the
all
the
data
whichever
I
have
used,
has
the
custom
properties.
So
these
are
all
the
custom
properties.
I
have
enabled
like
a
username,
what
is
a
web
id
and
what
is
the
site
url
and
the
user
login
name
and
the
user
email
so
based
on
this
property,
I
have
been
displaying
a
detailed
list
and
also
using
the
charts.
E
So
this
is
user
statistics,
so
here
you
can
see
the
user
which
page
they
have
logged
in
and
what
is
the
view
count,
and
next
is
the
performance
statistics
where
you
can
categorize
based
on
the
percentile
duration
of
whatever
the
pages,
and
there
are
also
a
couple
of
date-
range
filters.
You
can
access
it
so
so
this
is
very
simple:
I'm
just
retrieving
the
data
and
then
populating
it
here
using
the
detail
list
and
also
using
the
chart
component
so
to
access
this.
The
first
thing
is,
you
need
to
create
a
application
api
access.
E
You
need
to
have
access
to
this
application
id
and
also
you
need
to
create
a
api
key.
The
read
telemetry
is
more
than
enough.
We
are
just
going
to
fetch
the
data
and
then
displayed
it,
so
I
have
used
only
the
permission
as
re
telemetry.
So
once
you
provide
the
description,
the
key
will
be
displayed
only
once
so
you
have
to
copy
paste
the
key
somewhere
and
then
you
can
use
it
in
the
framework
using
use
it
in
the
web
part
and
regarding
one
of
the
artifacts
I'm
talking
about.
This
is
the
template.
E
E
And
you
can
see
all
the
details
so
how
to
use
these
details
in
the
sharepoint
framework.
You
need
the
custom
query,
so
you
can
just
click
this
lock
button
and
then
you
will
be
provided
with
the
query.
So
you
can
just
copy
this
query
and
then
the
time
span
and
the
time
interval
whatever
the
dynamic
values
you
can
replace
it,
you
can
replace
it
with
the
selection.
So
basically
I
have.
I
have
copied
all
the
queries
using
these
templates
and
then
I
have
created
a
dynamic
filters
and
then
passed
in
the
dynamic
values.
E
E
E
E
So
the
next
is
all
the
components
whichever
I
have
used
in
this
webpart
are
functional
components,
react
functional
component
and
I
also
used
react
context
api
so
because
for
each
statistics
I
have
provided,
I
have
created
a
new
functional
component
and
I
have
used
this
react
context
api
so
that
we
don't
have
to
pass
the
properties
from
the
parent
to
the
lower
child
component.
We
can
directly
access
the
properties
using
the
react
context
api.
E
So
these
are
all
different
components.
I
have
used
it
on
the
parent
component
page
we
use
user
statistics
and
performance
statistics
and
to
provide
a
look
and
feel
like
an
azure.
If
you
look,
if
you
look
at
this
structure,
so
it
is
something
the
azure
style.
So
in
order
to
do
that,
I
have
just
created
a
custom
pivot
component,
so
that
I'll
be
passing
in
the
dynamic
values.
E
E
E
So
this
is
one
of
the
sample.
The
custom
query
I
have
used
where,
as
I
already
mentioned,
you
can
parse
in
the
dynamic
values
the
time
span
and
the
time
interval-
and
here
I
am
just
passing
the
date-
range-
the
start
date
and
the
end
date.
Whichever
selected
by
the
user
to
the
custom
query-
and
this
is
the
common
function,
where
I'll
be
getting
all
the
responses
based
on
I'll,
be
passing
the
query
and
then
the
url
from
the
constructor
I'll
be
passing
it
to
this
function
and
then
I'll
get
the
response.
A
Very
cool,
great
demo
and
really
neat
use
of
that
code.
Tour
functionality.
I've
not
seen
a
lot
of
that.
So
that's
really
a
cool
way
to
do
that.
So
really,
nice
demo,
a
really
nice
solution,
david's
got
the
link
there
to
the
sample
so
appreciate
you
submitting
that
and
doing
the
demo
and
very
neat
stuff
love
to
see
that
sergey.
I
think
you
are
up
next.
If
you
want
to
take
over
the
presentation.
F
Yeah
hi
patrick
thank
you,
hello,
everyone,
yeah
and
just
a
quick
introduction.
My
name
is
sergey
sergeyev.
Most
of
the
time
I
work
as
sharepoint
and
microsoft,
365,
developer
and
consultant
also
mvp
under
office
development
category
and
in
this
demo
we
are
talking
about.
How
can
you
speed
up
the
performance
of
your
gulp
serve
command
the
command
you
use
during
sharepoint
framework
development,
so
I'm
going
to
start
with
just
a
brand
new
hello
world
web
part,
so
I'm
going
to
run
lots
of,
and
this
is
by
the
way
this
is
my
web
part.
F
F
So,
every
time
I
save
it
again
spin
up
the
same
process
and
finally,
in
the
very
end,
it
refreshes
your
browser
so
for
a
very
basic
hello
world
web
part,
it
works
quite
nice
quite
fast.
However,
the
problem
becomes
evident
if
you
have
a
large
solution
or
even
medium
solution
with
lots
of
web
parts,
for
example.
Here
let
me
go
to
this
tab
and
run
gobsurf
again,
and
this
is
the
sharepoint
framework,
modern
search
solution
by
the
way,
very,
very
great
solution
if
you
need
modern
search
in
your
websites.
F
F
Okay
ready
now,
I'm
going
to
add
a
web
part,
let's
say
verticals,
and
now
I'm
going
to
do
exactly
the
same,
I'm
going
to.
Let
me
move
it
again
to
the
right
side
and
this
one
to
the
left
side
and
let
me
open
a
search,
verticals
container
and
change
anything
here
like
this
one,
for
example,
and
click
save.
F
But
now
again,
this
sharepoint
framework
build
pipeline,
builds
or
compiles
that
called
compiles
the
project.
However,
this
time
it
works
a
lot
slower
simply
because
we
have
six
other
parts.
We
have
a
lot
of
other
code
services
providers
etc.
That
is
why
only
now
we
have
this
browser
refresh
event.
So
if
you
take
a
look
at
the
digest
numbers
here,
we
have
we
see
that
type
script
took
seven
seconds.
F
F
So
that's:
okay,
let's,
let's
wait
until
it
to
be
finished
so
a
few
more
seconds
and
finally,
our
page
is
refreshed
yeah.
So
how
can
you
improve
the
performance
in
this
case,
so
you
can
do
that
by
using
s
perfect
fast,
serve,
that's
a
special
tool
which
which
increase
the
speed
of
this
gulp
serve
sort
of
process.
F
F
It
also
takes
some
time,
but
fortunately
only
for
the
first
run.
So
again,
it's
I
don't
know.
Maybe
five
ten
seconds
more.
Let
me
close
this
one,
and
now
it
is
completed
successfully.
Let
me
add
again
search
verticals
so
this
time,
if
I
modify
anything
in
the
source
code
and
click
save,
then
it
also
compiles
the
sources.
F
However,
this
time
it
works
a
lot
faster,
so
for
for
the
first
time
it
was
four
seconds,
but
all
consequent
compiles
will
be
a
lot
faster.
It
will
be.
You
see
it's
it's
less
than
one
second
so,
and
you
also
can
see
how
fast
now
the
the
browser
and
how
fast
it
refreshes
the
page
when
I
save
anything
in
the
in
the
sources,
so
I
click
save
and
then
in
less
than
a
second,
it
refreshes
the
page.
F
F
That's
very
simple,
because
everything
you
need
is
you
need
to
install
spfx
fast,
serve
npm,
install
specifics
fast,
serve
globally,
then,
when
you're
ready,
simply
execute
as
prefix
fast
serve
command,
because
that's
a
cli
inside
your
root,
sharepoint
solution,
folder
like
this
and
then
as
perfect
fast
surf,
will
do
everything
for
you.
Basically,
under
the
hood,
it
creates
a
custom
webpack
based
build
which
produces
exactly
the
same
output
as
the
default
sharepoint
framework
build.
F
F
So
when
I
run
it
on
the
default
hello
world,
sorry
hello,
world
web
part,
then
you
see
that
now.
If
I
change
anything
here,
then
the
changes
will
be
reflected
almost
immediately,
so
it's
even
maybe
faster
than
for
hello
world
web
part,
then
how
it
works.
Under
the
hood,
as
I
said,
it
creates
a
custom
webpack
based
build.
Basically,
it
adds
this
webpack.js
file,
which
contains
essential
configuration
plugins
for
web
pack,
etc,
etc.
F
If
you
want
to
see
more
documentation,
then
the
documentation
is
available
at
github
here
and
basically
there
are
a
lot
of
documentation
here,
faqs
and
if
you
have
any
any
troubles,
please
raise
an
issue
and
I
will
try
to
to
help
you
to
resolve
this
issue
and
additionally,
what
are
other
cool
features
of
as
perfect
fast
serve?
Is
that
and
why
it
is
fast
because
all
calculations
are
done
in
memory,
so
we
do
not
have
any
additional
steps
or
additional
tasks.
F
A
Very
cool
tool:
I
encourage
folks
check
that
out.
That's
another
great
thing
to
add
into
your
toolbox
of
sharepoint
framework
development
really
exciting,
to
see
stuff
like
that
coming
out
of
the
community
and
great
work
sergey
on
that
and
the
time
savings
is
really
really
impressive
and
I
think
now
we're
ready
for
joel.
A
G
G
G
So
you,
for
example,
you
even
though,
out
of
the
box
web
parts,
you
can
see
that
you
don't
even
get
a
similar
experience
as
if
you
were
on
a
normal
page.
So
this
is
out
of
the
box.
As
you
can
see,
the
area
uf
is
much
wider
because
of
that
I
tried
to
find
ways
to
improve
it
and,
as
probably
many
of
you,
I
end
up
having
like
small
blocks
of
css,
for
when
I
was
on
the
workbench
to
try
to
remove
some
of
the
limitations
and
then
before
shipping
the
web
part.
G
I
will
just
get
rid
of
all
that,
so
I
decided
to
try
to
find
something
that
was
slightly
better
experience
than
that,
and
I
ended
up
picking
grabbing
that
code
from
different
projects
different
fixes.
I
was
doing
and
put
it
all
in
a
single
web
part
what
you
can
do
with
this
is
now.
You
can
simply
come
here.
G
Add
a
workbench
customize
it
to
your
page,
and
it
immediately
takes
the
width
of
the
of
a
modern
page.
You
can,
of
course,
customize
some
things
on
the
properties
you
can
by
default.
You
apply
the
styles
and
it
sets
it
to
preview
mode.
I'm
not
really
sure
why
we
we
have
the
edit
mode
by
default.
I
personally
tend
to
spend
a
lot
more
time,
building
the
ui
than
actually
the
web
part
properties
because
of
the
pnp
reusable
controls.
G
G
G
I
removed
some
of
the
logic
where
I
was
trying
to
understand
when
the
page
has
to
be
refreshed
or
not,
and
I
just
had
a
message
you
just
press
apply
and
then
you
refresh
the
page.
If
you
want
the
changes
to
be
reflected
and
there
you
go,
if
you
are
developing
full
width
pages
the
web,
the
workbench
couldn't
be
used
for
that
before.
So
you
can
simply
add
to
workbench
customizer
web
part,
and
that's
it.
G
G
G
So
if
you
want
to
run
it
locally,
one
thing
you
can
do
is
you
can
go
to
the
paid
webpart
documentation
where
I
have
some
information
out
on
how
to
run
it
locally
and
in
summary,
it's
copying
some
information
from
the
dist
folder
from
your
webpart
customizer
to
your
solution,
and
I
will
show
you
that
now
so,
if
we
so,
this
is
the
workbench
customizer
solution,
and
this
is
my
list
folder.
We
can
simply
come
here
paste
into
my
test
project
and
then
go
to
leave
web
parts.
G
G
What
is
this
fine
to
do?
Yes,
because
if
you
do
call
bundle
or
package
solution,
the
workbench
customizer
files
in
your
solution
will
be
completely
ignored
by
the
build
process
and
you
can-
or
you
can
simply,
if
you're,
not
very
confident
about
that
about
that.
You
can
simply
come
here
and
go
and
egypt
wipes
out
everything
and
your
solution.
G
G
G
Yes,
that's
a
very
bad
practice
if
you
are
doing
it
on
a
page,
but
I
don't
personally
don't
think
that's
a
problem
at
all
in
this
case,
because
this
is
just
the
workbench
it's
for
developers,
you're
not
going
to
break
anything.
The
class
case
scenario
the
way
part
one
to
what
you
need
and
you
just
get
rid
of
it.
G
Okay,
so
in
the
code,
this
is
as
simple
as
triple
three
proper
properties
that
we
have
on
the
web
part
and
then
for
each
property
we
have.
We
are
importing
a
stylesheet,
that's
probably
not
the
best
way
to
do
it.
I
was
playing
with
dynamic
imports
at
the
time.
I
never
got
to
change
it,
but
it
works.
So
probably
don't
bother
that
much
with
it
and
for
the
preview
I'm
going
really
dirty
here
and
I'm
just
simulating
a
click
on
that
button.
G
G
Playing
around
because
some
of
the
controls
were
on
toolbars
were
getting
on
the
way
so
just
doing
some
adjustments
there,
so
everything
works
fine
and
then
on
the
full
width.
We
just
do
again
some
small
adjustments
to
make
to
take
everything
out
of
the
way
and
allow
the
page
to
fully
stretch
and
that's
basically
it
so
two
css
files
and
click
simulation,
and
that's
it.
A
Awesome,
thank
you,
joel
great
demos,
from
joel
sergey
and
sudarasan.
Sorry
about
my
butchering
of
names.
I
just
want
to
thank
everybody
for
joining
the
call.
We've
got
a
little
bit
of
time
for
q
a
here
at
the
end.
If
folks
want
to
put
those
questions
into
the
chat
either
you
know
for
the
group
or
for
any
of
the
presenters.
A
To
do
any
idea
for
how
to
tie
in
the
modern
search
results
into
the
out
of
the
box
search
stats?
No,
not
off
top
my
head.
I
don't
that's
something.
Somebody
would
need
to
research
a
little
bit
in
terms
of
getting
that
going
react.
Use
effect
react
you
could
absolutely
use
it.
That's
newer
in
react.
I'm
bad
on
my
react.
Version
numbers
you
can
absolutely
use
it.
A
A
A
Okay,
I
don't
see
any
other
questions
coming
in,
so
just
want
to
thank
everybody
again.
Thank
you
all
for
attending
the
call
or
watching
the
call
later
on
and
the
recording
appreciate
all
of
you
taking
the
time
to
be
part
of
the
community.
I
want
to
thank
assume
drason,
sergey
and
joel
for
their
demos.
Recording
will
be
available
in
about
24
hours
give
or
take
on
the
pnp
youtube
channel.
You
can
subscribe
today
to
follow
to
get
all
the
updates
there
follow
us
on
twitter
and
then
as
well.
A
The
next
spfx
special
interest
group
call
will
be
august
13th
same
time
and
then
the
next
general
dev
call
is
next
thursday
august
6th.
At
the
same
time,
and
then
we've
got
the
august
monthly
community
call
coming
up,
that's
gonna,
be
august,
11th,
so
encourage
everybody
to
attend
all
or
some
of
those
as
time
permits,
and
if
you
can't
attend
live,
do
please
follow
up
on
the
recordings
to
get
caught
up
on
all
the
latest
updates
around
sharepoint
and
sharepoint
framework.
Thank
you.