Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(demos): Update remaining demo pages to use demoReady() #1920

Merged
merged 8 commits into from
Jan 13, 2018

Conversation

acdvorak
Copy link
Contributor

@acdvorak acdvorak commented Jan 10, 2018

Note: Our packaged JS is now being loaded with async, which speeds up initial rendering time over slow connections. Using "Mid-tier mobile" network emulation in Chrome devtools, the TTFMP of the button demo page was reduced from ~10.5s to ~9.5s, and the time to render the Material icon font dropped from ~12s to ~10.5s.

For this PR, I only updated the button demo page to use the new demoReady() function. I will create a separate follow-up PR to update the remaining demo pages to use demoReady().
# DO NOT MERGE

This PR depends on #1919. Please merge #1919 before merging this PR.

Our packaged JS is now being loaded with `async`, which speeds up initial rendering time over slow connections. Using "Mid-tier mobile" network emulation in Chrome devtools, the [TTFMP](https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint) of the button demo page was reduced from ~10.5s to ~9.5s, and the time to render the Material icon font dropped from ~12s to ~10.5s.
@codecov-io
Copy link

codecov-io commented Jan 10, 2018

Codecov Report

Merging #1920 into master will not change coverage.
The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff           @@
##           master    #1920   +/-   ##
=======================================
  Coverage   99.43%   99.43%           
=======================================
  Files          84       84           
  Lines        3721     3721           
  Branches      484      484           
=======================================
  Hits         3700     3700           
  Misses         21       21

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update d62beff...bf78518. Read the comment docs.

acdvorak added a commit that referenced this pull request Jan 12, 2018
For this PR, I only updated the button demo page to use the new `demoReady()` function. #1920 updates the remaining demo pages.

Also note that our packaged JS is now being loaded with `async`, which speeds up initial rendering time over slow connections. Using "Mid-tier mobile" network emulation in Chrome devtools, the [TTFMP](https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint) of the button demo page was reduced from ~10.5s to ~9.5s, and the time to render the Material icon font  dropped from ~12s to ~10.5s.
# Conflicts:
#	demos/button.html
#	demos/checkbox.html
#	demos/dialog.html
#	demos/drawer/persistent-drawer.html
#	demos/drawer/temporary-drawer.html
#	demos/fab.html
#	demos/grid-list.html
#	demos/icon-toggle.html
#	demos/linear-progress.html
#	demos/list.html
#	demos/radio.html
#	demos/ready.js
#	demos/ripple.html
#	demos/select.html
#	demos/simple-menu.html
#	demos/slider.html
#	demos/snackbar.html
#	demos/tabs.html
#	demos/text-field.html
#	demos/theme/index.html
#	demos/toolbar/default-flexible-toolbar.html
#	demos/toolbar/menu-toolbar.html
#	demos/toolbar/waterfall-flexible-toolbar-custom-style.html
#	demos/toolbar/waterfall-flexible-toolbar.html
#	demos/toolbar/waterfall-toolbar-fix-last-row.html
#	demos/toolbar/waterfall-toolbar.html
@bonniezhou bonniezhou self-assigned this Jan 12, 2018
acdvorak added a commit that referenced this pull request Jan 12, 2018
commit cc107d7
Merge: 5eae605 da34cc9
Author: Andy Dvorak <[email protected]>
Date:   Thu Jan 11 17:37:51 2018 -0800

    Merge branch 'master' into feat/demos/ready-all

    # Conflicts:
    #	demos/button.html
    #	demos/checkbox.html
    #	demos/dialog.html
    #	demos/drawer/persistent-drawer.html
    #	demos/drawer/temporary-drawer.html
    #	demos/fab.html
    #	demos/grid-list.html
    #	demos/icon-toggle.html
    #	demos/linear-progress.html
    #	demos/list.html
    #	demos/radio.html
    #	demos/ready.js
    #	demos/ripple.html
    #	demos/select.html
    #	demos/simple-menu.html
    #	demos/slider.html
    #	demos/snackbar.html
    #	demos/tabs.html
    #	demos/text-field.html
    #	demos/theme/index.html
    #	demos/toolbar/default-flexible-toolbar.html
    #	demos/toolbar/menu-toolbar.html
    #	demos/toolbar/waterfall-flexible-toolbar-custom-style.html
    #	demos/toolbar/waterfall-flexible-toolbar.html
    #	demos/toolbar/waterfall-toolbar-fix-last-row.html
    #	demos/toolbar/waterfall-toolbar.html

commit da34cc9
Author: Andrew C. Dvorak <[email protected]>
Date:   Thu Jan 11 17:09:46 2018 -0800

    feat(demos): Add global `demoReady()` function (#1919)

    For this PR, I only updated the button demo page to use the new `demoReady()` function. #1920 updates the remaining demo pages.

    Also note that our packaged JS is now being loaded with `async`, which speeds up initial rendering time over slow connections. Using "Mid-tier mobile" network emulation in Chrome devtools, the [TTFMP](https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint) of the button demo page was reduced from ~10.5s to ~9.5s, and the time to render the Material icon font  dropped from ~12s to ~10.5s.

commit aeed3bd
Author: Andrew C. Dvorak <[email protected]>
Date:   Thu Jan 11 16:18:24 2018 -0800

    docs: Remove broken link from team README (#1940)

    Fixes #1929

commit ffff10c
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 15:47:46 2018 -0800

    style(checkbox): Sort CSS so there is no descending specificity (#1939)

commit 6b1cabb
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 13:34:51 2018 -0800

    style(snackbar): Sort CSS so there is no descending specificity (#1936)

commit fd0c675
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 13:32:57 2018 -0800

    fix(dialog): Remove code that does nothing (#1935)

commit 3e5f6e0
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 13:06:46 2018 -0800

    fix(list): Fix the height of the dense avatar list (#1905)

commit 2267e0f
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 12:15:15 2018 -0800

    style(list): Sort CSS so there is no descending specificity (#1904)

commit 271a05e
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 12:12:48 2018 -0800

    style(grid-list): Sort CSS so there is no descending specificity (#1903)

commit 103d9bd
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 09:38:23 2018 -0800

    style(checkbox): Remove confusing nesting (#1874)

commit 5eae605
Author: Andy Dvorak <[email protected]>
Date:   Wed Jan 10 10:18:26 2018 -0800

    WIP: Remove arrow function for IE 11
commit d62beff
Author: Andrew C. Dvorak <[email protected]>
Date:   Fri Jan 12 12:42:09 2018 -0800

    chore(demos): Remove ripple examples from theme page (#1954)

    Ripple isn't an actual component, and other components on the page already have ripples, so there's no need for separate ripple examples on the page.

commit 145217c
Author: Will Ernest <[email protected]>
Date:   Fri Jan 12 09:01:55 2018 -0800

    chore(select): Remove multi-select from mdc-select. (#1917)

    BREAKING CHANGE: Removes mdc-multi-select from the mdc-select package. Use lists to create components that allow multiple items to be selected.
Copy link
Contributor

@bonniezhou bonniezhou left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Couple extra indents, otherwise LGTM!

<path class="mdc-checkbox__checkmark__path" fill="none" stroke="white" d="M1.73,12.91 8.1,19.28 22.79,4.59" />
</svg>
<div class="mdc-checkbox__mixedmark"></div>
<div class="mdc-form-field">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extra indent on this block

@@ -582,7 +583,7 @@ <h3 class="mdc-typography--headline demo-component-section__heading">
</div>
</div>
<label id="demo-radio-8-label" for="demo-radio-8">Disabled 2</label>
</div>
</div>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extra indent on this line

acdvorak added a commit that referenced this pull request Jan 13, 2018
commit 738c81c
Merge: d51d2e9 d62beff
Author: Andy Dvorak <[email protected]>
Date:   Fri Jan 12 14:05:58 2018 -0800

    Merge remote-tracking branch 'origin/master' into feat/demos/ready-all

    # Conflicts:
    #	demos/theme/index.html

commit d51d2e9
Author: Andy Dvorak <[email protected]>
Date:   Fri Jan 12 14:05:33 2018 -0800

    WIP: Squashed commit of the following:

    commit d62beff
    Author: Andrew C. Dvorak <[email protected]>
    Date:   Fri Jan 12 12:42:09 2018 -0800

        chore(demos): Remove ripple examples from theme page (#1954)

        Ripple isn't an actual component, and other components on the page already have ripples, so there's no need for separate ripple examples on the page.

    commit 145217c
    Author: Will Ernest <[email protected]>
    Date:   Fri Jan 12 09:01:55 2018 -0800

        chore(select): Remove multi-select from mdc-select. (#1917)

        BREAKING CHANGE: Removes mdc-multi-select from the mdc-select package. Use lists to create components that allow multiple items to be selected.

commit d62beff
Author: Andrew C. Dvorak <[email protected]>
Date:   Fri Jan 12 12:42:09 2018 -0800

    chore(demos): Remove ripple examples from theme page (#1954)

    Ripple isn't an actual component, and other components on the page already have ripples, so there's no need for separate ripple examples on the page.

commit 145217c
Author: Will Ernest <[email protected]>
Date:   Fri Jan 12 09:01:55 2018 -0800

    chore(select): Remove multi-select from mdc-select. (#1917)

    BREAKING CHANGE: Removes mdc-multi-select from the mdc-select package. Use lists to create components that allow multiple items to be selected.

commit cc107d7
Merge: 5eae605 da34cc9
Author: Andy Dvorak <[email protected]>
Date:   Thu Jan 11 17:37:51 2018 -0800

    Merge branch 'master' into feat/demos/ready-all

    # Conflicts:
    #	demos/button.html
    #	demos/checkbox.html
    #	demos/dialog.html
    #	demos/drawer/persistent-drawer.html
    #	demos/drawer/temporary-drawer.html
    #	demos/fab.html
    #	demos/grid-list.html
    #	demos/icon-toggle.html
    #	demos/linear-progress.html
    #	demos/list.html
    #	demos/radio.html
    #	demos/ready.js
    #	demos/ripple.html
    #	demos/select.html
    #	demos/simple-menu.html
    #	demos/slider.html
    #	demos/snackbar.html
    #	demos/tabs.html
    #	demos/text-field.html
    #	demos/theme/index.html
    #	demos/toolbar/default-flexible-toolbar.html
    #	demos/toolbar/menu-toolbar.html
    #	demos/toolbar/waterfall-flexible-toolbar-custom-style.html
    #	demos/toolbar/waterfall-flexible-toolbar.html
    #	demos/toolbar/waterfall-toolbar-fix-last-row.html
    #	demos/toolbar/waterfall-toolbar.html

commit da34cc9
Author: Andrew C. Dvorak <[email protected]>
Date:   Thu Jan 11 17:09:46 2018 -0800

    feat(demos): Add global `demoReady()` function (#1919)

    For this PR, I only updated the button demo page to use the new `demoReady()` function. #1920 updates the remaining demo pages.

    Also note that our packaged JS is now being loaded with `async`, which speeds up initial rendering time over slow connections. Using "Mid-tier mobile" network emulation in Chrome devtools, the [TTFMP](https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint) of the button demo page was reduced from ~10.5s to ~9.5s, and the time to render the Material icon font  dropped from ~12s to ~10.5s.

commit aeed3bd
Author: Andrew C. Dvorak <[email protected]>
Date:   Thu Jan 11 16:18:24 2018 -0800

    docs: Remove broken link from team README (#1940)

    Fixes #1929

commit ffff10c
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 15:47:46 2018 -0800

    style(checkbox): Sort CSS so there is no descending specificity (#1939)

commit 6b1cabb
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 13:34:51 2018 -0800

    style(snackbar): Sort CSS so there is no descending specificity (#1936)

commit fd0c675
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 13:32:57 2018 -0800

    fix(dialog): Remove code that does nothing (#1935)

commit 3e5f6e0
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 13:06:46 2018 -0800

    fix(list): Fix the height of the dense avatar list (#1905)

commit 2267e0f
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 12:15:15 2018 -0800

    style(list): Sort CSS so there is no descending specificity (#1904)

commit 271a05e
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 12:12:48 2018 -0800

    style(grid-list): Sort CSS so there is no descending specificity (#1903)

commit 103d9bd
Author: Lynn Jepsen <[email protected]>
Date:   Thu Jan 11 09:38:23 2018 -0800

    style(checkbox): Remove confusing nesting (#1874)

commit 5eae605
Author: Andy Dvorak <[email protected]>
Date:   Wed Jan 10 10:18:26 2018 -0800

    WIP: Remove arrow function for IE 11
commit 82a9fa3
Author: Will Ernest <[email protected]>
Date:   Fri Jan 12 14:18:37 2018 -0800

    fix(select): Remove unused JS logic for bottom-line scaleX transform (#1910)

    fix(select): Remove unused JS logic for bottom-line scaleX transform and matching test
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants