Optional Features

[deepakduggirala]

"Genome Browser" - This field is only relevant in CMG / Xenium applications.

Options:
After merging bioloop commit to remove genome_browser into Xenium, apply a reverse commit to bring back the genome_browser feature in Xenium.

[deepakduggirala]

Also remove "data files" or "genome files"?

[deepakduggirala]

Vue Dynamic import of optional features

• if a feature is not required in some bioloop instances, make it into a component and dynamically import it. The code for that component will not be included in the build?

To enable or disable features in a Vue 3 app built with Vite based on configuration, you can use conditional rendering and dynamic imports. Here's a basic approach:

1. Create a Configuration File:
   Start by creating a configuration file (e.g., config.js) where you can define feature flags or settings.

// config.js
   export default {
     enableFeatureA: true,
     enableFeatureB: false,
   };

2. Use Dynamic Imports:
   In your Vue components, use dynamic imports based on the configuration settings.

// MyComponent.vue
import config from '@/config';

export default {
 async mounted() {
   if (config.enableFeatureA) {
     const { featureA } = await import('./FeatureA');
     // Use featureA here
   }

   if (config.enableFeatureB) {
     const { featureB } = await import('./FeatureB');
     // Use featureB here
   }
 },
};

3. Webpack Chunking:
   Vite and Webpack automatically handle code splitting when using dynamic imports. Features that are not enabled will not be included in the main bundle.

4. Build the App:
   When you build your Vite app (vite build), it will generate separate chunks for each dynamically imported feature. Disabled features will not be included in the main bundle, reducing the final bundle size.

Remember to manage your dependencies and imports carefully to avoid unnecessary code in the final build.

This approach ensures that only the necessary code for enabled features is included in the final build, helping to keep your app lightweight and efficient.