Abid_Jamil_-_Mobile_App_Performance.pdf

Transcript

1. Mobile App Performance Monitoring Abid Jami l Functional Lead, Jugnu
3. Crashlytics helps you to collect analytics and details about crashes and errors that occur in your app.
4. Crashlytics Installation npm install @react-native-firebase/app npm install @react-native-firebase/crashlytics
5. Crashlytics Dependencies // Add the dependency for the Crashlytics Gradle plugi n 
 classpath 'com.google.firebase:firebase-crashlytics-gradle:2.9.2' 
 Project Level Build Gradle
6. Crashlytics Dependencies // Add the dependencies for the Crashlytics and Analytics libraries 
 // When using the BoM, you don't specify versions in Firebase library dependencie s implementation 'com.google.firebase:firebase-crashlytics ' implementation ‘com.google.firebase:firebase-analytics ' 
 App Level Build Gradle
7. Crashlytics Dependencies // Add the Crashlytics Gradle plugin
 
 id 'com.google.firebase.crashlytics' 
 App Level Build Gradle
8. Create firebase.json at Root { "react-native": { "crashlytics_debug_enabled": false, "crashlytics_disable_auto_disabler": true, "crashlytics_auto_collection_enabled": true, "crashlytics_is_error_generation_on_js_crash_enabled": true, "crashlytics_javascript_exception_handler_chaining_enabled": true } }
9. Get attached with user crashlytics().log('User signed in.'); await Promise.all([ crashlytics().setUserId(user.uid), crashlytics().setAttribute('cleverTapId', String(user.clevertapId)), crashlytics().setAttributes({ role: 'user', phone: user.phone, email: user.email, username: user.username, }), ]);
10. Create logs for better debuggin g crashlytics().log('App mounted.’); crashlytics().log(‘Cart Opened.’); crashlytics().log(‘Promo Applied.’); crashlytics().log(JSON.Stringify(orderData));
11. Record Error for better debuggin g try{ } catch(e){ crashlytics().recordError(e); }
12. Check if previously crashed to give better user experience didCrashOnPreviousExecution(): Promise<boolean>;
14. Performance Dependencies // Add the dependency for the Crashlytics Gradle plugi n 
 classpath 'com.google.firebase:firebase-perf-gradle:2.9.2' 
 Project Level Build Gradle
15. Performance Dependencies // Add the dependencies for the Crashlytics and Analytics libraries 
 // When using the BoM, you don't specify versions in Firebase library dependencie s implementation 'com.google.firebase:firebase-perf '   
 App Level Build Gradle
16. Performance Dependencies // Add the Crashlytics Gradle plugin
 
 id ‘com.google.firebase.perf' 
 App Level Build Gradle
17. Create firebase.json at Root { "react-native": { "crashlytics_debug_enabled": false, "crashlytics_disable_auto_disabler": true, "crashlytics_auto_collection_enabled": true, "crashlytics_is_error_generation_on_js_crash_enabled": true, "crashlytics_javascript_exception_handler_chaining_enabled": true } }
18. Create a custom trace for each scenario perf().startTrace("HomeScreenRendering").then((_trace)=>{ trace = _trace _trace.putAttribute('user', user?.id) }).catch((e)=>{console.log(e)}) trace.stop();
19. Create a custom trace for each scenario async function getRequest(url) { // Define the network metric const metric = await perf().newHttpMetric(url, 'GET'); // Define meta details metric.putAttribute('user', 'abcd'); // Start the metric await metric.start(); // Perform a HTTP request and provide response information const response = await fetch(url); metric.setHttpResponseCode(response.status); metric.setResponseContentType(response.headers.get('Content-Type')); metric.setResponsePayloadSize(response.headers.get('Content-Length')); // Stop the metric await metric.stop(); return response.json(); }
20. Thank You! https://www.linkedin.com/in/abidjamil/