├── .eleventy.js ├── .gitignore ├── .node-version ├── CONTRIBUTING.md ├── CONTRIBUTORS.md ├── README.md ├── package.json └── src ├── _includes ├── article.njk └── layout.njk ├── assets ├── expected_ads.gif ├── fast_start_og_image.jpg ├── favicon.png ├── immutable_layout_og_image.jpg ├── no_spinners.svg ├── no_spinners_animated.svg ├── octocat_github_link_image_white_sized.svg ├── pushy_ads.gif ├── skeletal_design_perception_time_diagram.svg ├── skeletal_designs_diagrams │ ├── Artboard4.png │ ├── Artboard5.png │ ├── Artboard6.png │ ├── graybox_loaded.mp4 │ ├── owlboi.mp4 │ ├── owlboi2.mp4 │ ├── smol_spsd_loading_elements_example.mp4 │ ├── social_media_profile_load_skeleton_example.mp4 │ ├── speedpatterns_skeletal_design_layout_shift_example.mp4 │ ├── spsd_loading_elements_example.mp4 │ ├── spsd_loading_elements_example_320wide.mp4 │ ├── spsd_social_media_feed_diagram_2image.mp4 │ ├── spsd_social_media_feed_gray_boxes.mp4 │ └── spsd_social_media_feed_shorter_gray_boxes.mp4 ├── skeletal_designs_og_image.png ├── slow_first_paint.png ├── slow_first_request.png ├── slow_paint_filmstrip.png ├── speed_patterns_burger_menu.svg └── speed_patterns_og_image.jpg ├── index.njk ├── patterns ├── fast_start.md ├── immutable_layout.md └── skeletal_designs.md └── style.css /.eleventy.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/.eleventy.js -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | _site 3 | .DS_Store -------------------------------------------------------------------------------- /.node-version: -------------------------------------------------------------------------------- 1 | 16 -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/CONTRIBUTING.md -------------------------------------------------------------------------------- /CONTRIBUTORS.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/CONTRIBUTORS.md -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/README.md -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/package.json -------------------------------------------------------------------------------- /src/_includes/article.njk: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/_includes/article.njk -------------------------------------------------------------------------------- /src/_includes/layout.njk: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/_includes/layout.njk -------------------------------------------------------------------------------- /src/assets/expected_ads.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/expected_ads.gif -------------------------------------------------------------------------------- /src/assets/fast_start_og_image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/fast_start_og_image.jpg -------------------------------------------------------------------------------- /src/assets/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/favicon.png -------------------------------------------------------------------------------- /src/assets/immutable_layout_og_image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/immutable_layout_og_image.jpg -------------------------------------------------------------------------------- /src/assets/no_spinners.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/no_spinners.svg -------------------------------------------------------------------------------- /src/assets/no_spinners_animated.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/no_spinners_animated.svg -------------------------------------------------------------------------------- /src/assets/octocat_github_link_image_white_sized.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/octocat_github_link_image_white_sized.svg -------------------------------------------------------------------------------- /src/assets/pushy_ads.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/pushy_ads.gif -------------------------------------------------------------------------------- /src/assets/skeletal_design_perception_time_diagram.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_design_perception_time_diagram.svg -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/Artboard4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/Artboard4.png -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/Artboard5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/Artboard5.png -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/Artboard6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/Artboard6.png -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/graybox_loaded.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/graybox_loaded.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/owlboi.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/owlboi.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/owlboi2.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/owlboi2.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/smol_spsd_loading_elements_example.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/smol_spsd_loading_elements_example.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/social_media_profile_load_skeleton_example.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/social_media_profile_load_skeleton_example.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/speedpatterns_skeletal_design_layout_shift_example.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/speedpatterns_skeletal_design_layout_shift_example.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/spsd_loading_elements_example.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/spsd_loading_elements_example.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/spsd_loading_elements_example_320wide.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/spsd_loading_elements_example_320wide.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/spsd_social_media_feed_diagram_2image.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/spsd_social_media_feed_diagram_2image.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/spsd_social_media_feed_gray_boxes.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/spsd_social_media_feed_gray_boxes.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_diagrams/spsd_social_media_feed_shorter_gray_boxes.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_diagrams/spsd_social_media_feed_shorter_gray_boxes.mp4 -------------------------------------------------------------------------------- /src/assets/skeletal_designs_og_image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/skeletal_designs_og_image.png -------------------------------------------------------------------------------- /src/assets/slow_first_paint.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/slow_first_paint.png -------------------------------------------------------------------------------- /src/assets/slow_first_request.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/slow_first_request.png -------------------------------------------------------------------------------- /src/assets/slow_paint_filmstrip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/slow_paint_filmstrip.png -------------------------------------------------------------------------------- /src/assets/speed_patterns_burger_menu.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/speed_patterns_burger_menu.svg -------------------------------------------------------------------------------- /src/assets/speed_patterns_og_image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/assets/speed_patterns_og_image.jpg -------------------------------------------------------------------------------- /src/index.njk: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/index.njk -------------------------------------------------------------------------------- /src/patterns/fast_start.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/patterns/fast_start.md -------------------------------------------------------------------------------- /src/patterns/immutable_layout.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/patterns/immutable_layout.md -------------------------------------------------------------------------------- /src/patterns/skeletal_designs.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/patterns/skeletal_designs.md -------------------------------------------------------------------------------- /src/style.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Speed-Patterns/speed-patterns/HEAD/src/style.css --------------------------------------------------------------------------------