The latest release of . Let’s take a look at what this means in terms of implementation & benchmarking. AWS Amplify now includes modular imports Overview is a library that allows to quickly & easily connect their apps to cloud resources to enable functionality like Authentication, GraphQL, Analytics, Chatbots, Serverless functions & more. AWS Amplify JavaScript developers As the AWS Amplify library grows & more features are added, it’s become apparent that we needed to modularize the library so that developers could import only the features that they needed without any excess code. This means that you can now import only the individual modules you would like to use: import Auth from '@aws-amplify/auth'import Analytics from '@aws-amplify/analytics'import API from '@aws-amplify/api'import Storage from '@aws-amplify/storage'import PubSub from '@aws-amplify/pubsub' Instead of getting the whole library, unnecessarily increasing the size of your JS bundle: import { Auth } from 'aws-amplify' When configuring your app with AWS Amplify, you can also just import the Amplify library from core & call configure this way: import Amplify from ' -amplify/core'import config from './aws-exports'Amplify.configure(config) @aws Benchmark We’ve tested all modules, & they in lighthouse for performance and best practice when using GZIP text compression. all score 100 Auth and Analytics Modular builds decreases bundle size by in plain JavaScript 10% Modular builds decreases time to first meaningful paint by in plain JavaScript. 15% Auth and Interactions in React Modular builds decreases overall bundle size by using , , , and categories. 69% create-react-app withAuthenticator Auth Interactions Modular builds decreases time to first meaningful paint by using create-react-app, withAuthenticator, Auth, and Interactions categories. 17% Bundle Sizes Vanilla JavaScript with the entire library: First meaningful paint: 219 KB GZIP 130ms Vanilla JavaScript with only Auth and Analytics: ​ First meaningful paint: 199 KB GZIP 150 ms React created using create-react-app with entire library: First meaningful paint: withAuthenticator 816 KB GZIP (includes React.js) 280 ms React created using create-react-app with only Auth and Interactions: **481 KB GZIP (includes React.js)**First meaningful paint: withAuthenticator 240 ms Conclusion As the AWS Amplify team continues iterating on & improving the library, we’ll also always be looking for ways to make the library faster & smaller. If you have any suggestions or comments, please feel free to ! submit an issue To learn more about modular imports in AWS Amplify, click . here

Too Long; Didn't Read

Making security fun one episode at a time

Modular imports with AWS Amplify

Too Long; Didn't Read

Nader Dabit

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

Modular imports with AWS Amplify

Too Long; Didn't Read

Nader Dabit

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

RELATED STORIES