Experience

Whether to Use APP Theme Variables

Definition: The Miniprogram should use APP theme variables to ensure that the theme color of the Miniprogram follows the configuration of the APP. This rule is currently only detected in the IDE experience audit mode.
Scoring Standard: Scoring Condition: Whether the page [pagePath].json and app configuration app.json use APP theme variables, such as backgroundColor、navigationBarBackgroundColor
Optimization Suggestions:

  • Use APP theme variables to ensure that the theme color of the Miniprogram follows the configuration of the APP.

Whether to Support Dark Mode

Definition: The Miniprogram should support dark mode. This rule is currently only detected in the IDE experience audit mode.
Scoring Standard: Scoring Condition: Whether the app.json configuration is correct.
Optimization Suggestions:

  • app.json should have darkmode configured correctly, and use APP theme variables to adapt to changes in theme color and dark mode.

Whether to Support Multi-Language

Definition: The Miniprogram should support multi-language. This rule is currently only detected in the IDE experience audit mode.
Scoring Standard: Scoring Condition: Whether the business code contains hard-coded Chinese.
Optimization Suggestions:

  • Avoid using hard-coded Chinese in business code, use multi-language adaptation.

Whether to Set Appropriate Clickable Areas

Definition: We should reasonably set the clickable area size of interactive elements, if too small, it will be very difficult for users to click, and the experience will be very poor.
Scoring Standard: Scoring Condition: Whether the clickable area width and height of interactive elements are not less than 40px.
Optimization Suggestions:

  • Optimize the clickable area of interactive elements, ensuring that the clickable area width and height are not less than 40px.

Whether to Support Safe Area

Definition: All fixed-position (position: fixed) interactive components should be rendered within the safe area, otherwise, it may fail to trigger event responses or easily trigger the Home Indicator.
Scoring Standard: Scoring Condition: Whether the position: fixed and interactive components are rendered within the safe area.
Optimization Suggestions:

  • Ensure that the position: fixed and interactive components are rendered within the safe area, using safe-area-inset-top、safe-area-inset-bottom and other safe area variables.