Platform | Operating System | Browser Version | FPS | Recommended Configuration | Remarks |
Web | Windows | Chrome 90+ Firefox 90+ Edge 97+ | 30 | Memory: 16GB CPU: i5-10500 GPU: Dedicated 2GB | It is recommended to use the latest version of Chrome browser (Enable hardware acceleration in the browser) |
| | | | 15 | Memory: 8GB CPU: i3-8300 GPU: Integrated Intel 1GB |
| | Mac | Chrome 98+ Firefox 96+ Safari 14+ | 30 | 2019 MacBookMemory: 16GB (2667MHz) CPU: i7 (6-core 2.60GHz) GPU: AMD Radeon 5300M |
| Android | Chrome Firefox | 30 | High-end devices (e.g., Qualcomm Snapdragon 8 Gen1) | It is recommended to use Chrome, or Firefox browsers and other mainstream browsers |
| | | | 20 | Mid-range devices (e.g., MediaTek Dimensity 8000-MAX) |
| | | | 10 | Low-end devices (e.g., Qualcomm Snapdragon 660) |
| iOS | Chrome Safari Firefox | 30 | iPhone 13 | Requires iOS 14.4 or above- It is recommended to use Chrome or Safari browsers |
| | | | 20 | iPhone XR |
import TRTC from 'trtc-sdk-v5';import { Beauty } from 'trtc-sdk-v5/plugins/video-effect/beauty';const trtc = TRTC.create({ plugins: [Beauty] });
await trtc.startLocalVideo({view: 'local-video' // Fill in the div id});
trtc.startPlugin('Beauty', options)
to enable the beauty effect.trtc.updatePlugin('Beauty', options)
to update the beauty effect parameters.trtc.stopPlugin('Beauty')
to stop the beauty effect.options
parameter supports six beauty effect parameters:type BeautifyOptions = {whiten?: number; // Whitening 0-1dermabrasion?: number; // Dermabrasion 0-1lift?: number; // Face Slimming 0-1shave?: number; // Jaw Shaving 0-1eye?: number; // Enlarged Eyes 0-1chin?: number; // Chin Adjustment 0-1}
EffectId | Name |
EDE5D18065451445 | Milk-Bottle-Face-Mask |
7A62218064EF7959 | Felt-Hairband |
B4D63180653948C3 | Bangs-Headband |
D7C6418064B90F4C | Cute-Kitty |
1D6EB18069D76A62 | Polka-Dot-Girl |
CBE7618065D9D76F | Heart-Fireworks |
9B86618065596018 | Cute-Piggy |
428C518065369ACF | Double-Braids |
B30E218064F7B397 | Vibrant-Stickers |
AE3C81806521B49B | Rabbit-Sauce |
EffectId
to identify the effect which will be apply.type EffectListOptions = {id: string;intensity?: number; // specify the strength of the effect}
options
should also include the current user's login information (sdkAppId, userId, userSig) for verification.// Enable the pluginconst options = {sdkAppId: 0,userId: '',userSig: '',// BeautifyOptionswhiten: 0.5, // Whitening 0-1dermabrasion: 0.5, // Dermabrasion 0-1lift: 0.5, // Face Slimming 0-1shave: 0.5, // Jaw Shaving 0-1eye: 0.5, // Enlarged Eyes 0-1chin: 0.5, // Chin Adjustment 0-1// EffectListOptions Arrayeffect: [{id: '7A62218064EF7959', // the effect idintensity: 0.7 // specify the strength of the effect}]}try {await trtc.startPlugin('Beauty', options);} catch (error) {console.error('Beauty start failed', error);}
// Update beauty parametersconst options = {whiten: 0.5, // Whitening 0-1dermabrasion: 0.5, // Dermabrasion 0-1lift: 0.5, // Face Slimming 0-1shave: 0.5, // Jaw Shaving 0-1eye: 0.5, // Enlarged Eyes 0-1chin: 0.5, // Chin Adjustment 0-1effect: [{id: '7A62218064EF7959', // the effect idintensity: 0.7, // specify the strength of the effect},{id: 'D7C6418064B90F4C', // the effect idintensity: 0.7, // specify the strength of the effect}]}try {await trtc.updatePlugin('Beauty', options);} catch (error) {console.error('Beauty update failed', error);}
// Stop the beauty effecttry {await trtc.stopPlugin('Beauty');} catch (error) {console.error('Beauty stop failed', error);}
Name | Type | Attributes | Description |
sdkAppId | number | Required | Current application ID |
userId | string | Required | Current user ID |
userSig | string | Required | UserSig corresponding to the user ID |
whiten | number | Optional | Whitening, range [0,1] |
dermabrasion | number | Optional | Dermabrasion, range [0,1] |
lift | number | Optional | Face slimming, range [0,1] |
shave | number | Optional | Jaw shaving, range [0,1] |
eye | number | Optional | Enlarged eyes, range [0,1] |
chin | number | Optional | Chin adjustment, range [0,1] |
effect | Array<EffectListOptions> | Optional | effect list |
onError | (error) => {} | Optional | Callback for errors that occur during runtime error.code=10000003 indicates high rendering latency error.code=10000006 indicates insufficient browser feature support, which may lead to lagging. Recommended solutions can be found in the Common Issues section at the end of the document. |
Name | Type | Attributes | Description |
id | number | Required | The effect id |
intensity | string | Required | the strength of the effect |
Name | Type | Attributes | Description |
whiten | number | Optional | Whitening, range [0,1] |
dermabrasion | number | Optional | Dermabrasion, range [0,1] |
lift | number | Optional | Face slimming, range [0,1] |
shave | number | Optional | Jaw shaving, range [0,1] |
eye | number | Optional | Enlarged eyes, range [0,1] |
chin | number | Optional | Chin adjustment, range [0,1] |
effect | Array<EffectListOptions> | Optional | effect list |
Name | Type | Attributes | Description |
id | number | Required | The effect id |
intensity | string | Required | the strength of the effect |
chrome://settings/system
into your browser's address bar and enable hardware acceleration mode.async function onError(error) {const { code } = error;if (code === 10000003 || code === 10000006) {// Reduce resolution and frame rateawait trtc.updateLocalVideo({option: {profile: '480p_2'},});// await trtc.stopPlugin('Beauty'); // Or disable the plugin}}await trtc.startPlugin('Beauty', {...// Other parametersonError,});
Was this page helpful?