Android-specific Custom Tabs optimization features for improved performance and user experience. These functions provide fine-grained control over the Custom Tabs lifecycle, allowing you to warm up browsers, pre-load URLs, and manage connections efficiently.
Returns information about browsers that support Custom Tabs on the Android device. This includes the default browser, preferred browser for Custom Tabs, and all available supporting browsers.
/**
* Returns list of applications supporting Custom Tabs
* May not be fully reliable since it uses PackageManager.getResolvingActivities
* @returns Promise resolving to WebBrowserCustomTabsResults with browser information
* @platform android
*/
function getCustomTabsSupportingBrowsersAsync(): Promise<WebBrowserCustomTabsResults>;Usage Example:
import * as WebBrowser from 'expo-web-browser';
const browserInfo = await WebBrowser.getCustomTabsSupportingBrowsersAsync();
console.log('Default browser:', browserInfo.defaultBrowserPackage);
console.log('Preferred for Custom Tabs:', browserInfo.preferredBrowserPackage);
console.log('All supporting browsers:', browserInfo.browserPackages);
console.log('Service supporting browsers:', browserInfo.servicePackages);
// Use preferred browser for better performance
if (browserInfo.preferredBrowserPackage) {
await WebBrowser.openBrowserAsync('https://example.com', {
browserPackage: browserInfo.preferredBrowserPackage
});
}Calls the warmUp method on CustomTabsClient for the specified browser package. This prepares the browser for faster launching by initializing background processes.
/**
* Warms up Custom Tabs client for specified browser package
* @param browserPackage - Package of browser to warm up. If not set, preferred browser is used
* @returns Promise resolving to WebBrowserWarmUpResult
* @platform android
*/
function warmUpAsync(browserPackage?: string): Promise<WebBrowserWarmUpResult>;Usage Example:
import * as WebBrowser from 'expo-web-browser';
// Warm up default/preferred browser
const warmUpResult = await WebBrowser.warmUpAsync();
console.log('Warmed up browser:', warmUpResult.servicePackage);
// Warm up specific browser
const chromeResult = await WebBrowser.warmUpAsync('com.android.chrome');
console.log('Chrome warmed up:', chromeResult.servicePackage);
// Later, open browser - should be faster due to warm up
await WebBrowser.openBrowserAsync('https://example.com');Initiates CustomTabsSession and calls its mayLaunchUrl method to hint to the browser that a URL is likely to be loaded soon. This can significantly improve page load times.
/**
* Pre-loads URL hint for faster Custom Tabs launch
* @param url - URL that is likely to be loaded first when opening browser
* @param browserPackage - Package of browser to inform. If not set, preferred browser is used
* @returns Promise resolving to WebBrowserMayInitWithUrlResult
* @platform android
*/
function mayInitWithUrlAsync(
url: string,
browserPackage?: string
): Promise<WebBrowserMayInitWithUrlResult>;Usage Example:
import * as WebBrowser from 'expo-web-browser';
// Pre-load a URL that user is likely to visit
const initResult = await WebBrowser.mayInitWithUrlAsync('https://example.com/login');
console.log('Pre-initialized URL with browser:', initResult.servicePackage);
// When user actually clicks to open, it should load faster
const openButton = () => {
WebBrowser.openBrowserAsync('https://example.com/login');
};
// Pre-load specific URL with specific browser
await WebBrowser.mayInitWithUrlAsync(
'https://checkout.example.com',
'com.android.chrome'
);Removes all bindings to services created by warmUpAsync or mayInitWithUrlAsync. Call this method when you no longer need the optimization to avoid potential memory leaks.
/**
* Removes all Custom Tabs service bindings to prevent memory leaks
* @param browserPackage - Package of browser to cool down. If not set, preferred browser is used
* @returns Promise resolving to WebBrowserCoolDownResult or empty object if no connection to dismiss
* @platform android
*/
function coolDownAsync(browserPackage?: string): Promise<WebBrowserCoolDownResult>;Usage Example:
import * as WebBrowser from 'expo-web-browser';
// Warm up and pre-load for performance
await WebBrowser.warmUpAsync();
await WebBrowser.mayInitWithUrlAsync('https://example.com');
// Use the optimized browser
await WebBrowser.openBrowserAsync('https://example.com');
// Clean up when done to prevent memory leaks
const coolDownResult = await WebBrowser.coolDownAsync();
console.log('Cooled down browser:', coolDownResult.servicePackage);
// Cool down specific browser
await WebBrowser.coolDownAsync('com.android.chrome');
// In a React component cleanup
useEffect(() => {
return () => {
// Cleanup on component unmount
WebBrowser.coolDownAsync();
};
}, []);interface WebBrowserCustomTabsResults {
/**
* Default browser package chosen by user, null if none exists
* Usually means user will be prompted to choose from available packages
*/
defaultBrowserPackage?: string;
/**
* Package preferred by CustomTabsClient for Custom Tabs
* Favors browser chosen by user as default, as long as it supports Custom Tabs
* May be null when no such browser is installed
*/
preferredBrowserPackage?: string;
/**
* All packages recognized as capable of handling Custom Tabs
* Empty array means no supporting browsers on device
*/
browserPackages: string[];
/**
* All packages capable of handling Custom Tabs Service
* Used by warmUpAsync, mayInitWithUrlAsync, and coolDownAsync
*/
servicePackages: string[];
}
interface ServiceActionResult {
/** Package name of the browser service that was used */
servicePackage?: string;
}
type WebBrowserWarmUpResult = ServiceActionResult;
type WebBrowserMayInitWithUrlResult = ServiceActionResult;
type WebBrowserCoolDownResult = ServiceActionResult;import * as WebBrowser from 'expo-web-browser';
class CustomTabsManager {
private isWarmedUp = false;
async prepareForBrowsing(urls: string[]) {
// 1. Warm up the browser
if (!this.isWarmedUp) {
await WebBrowser.warmUpAsync();
this.isWarmedUp = true;
}
// 2. Pre-load likely URLs
for (const url of urls) {
await WebBrowser.mayInitWithUrlAsync(url);
}
}
async openOptimizedBrowser(url: string) {
// Browser should open faster due to preparation
return WebBrowser.openBrowserAsync(url);
}
async cleanup() {
// Clean up to prevent memory leaks
if (this.isWarmedUp) {
await WebBrowser.coolDownAsync();
this.isWarmedUp = false;
}
}
}coolDownAsync() when you no longer need Custom Tabs optimizationgetCustomTabsSupportingBrowsersAsync() to identify the best browser for your use casepreferredBrowserPackage over defaultBrowserPackage for Custom Tabs functionality