GSoC'25 idea: Maintain and Improve the IHR Website Codebase

[dpgiakatos]

The IHR website has a large codebase. This time, instead of adding new features, let's focus on maintaining and improving the existing features.

[srinitha709]

Ya this is a good idea the IHR website, with its extensive codebase, provides a solid foundation. To improve and maintain it effectively, focusing on optimization, refactoring, and enhancing user experience will be the main key
so below are some strategies i think would be helpful in achieving this
Improving the Code Quality & Consistency
Refactoring the existing components for better reusability and maintainability ,Split large components into smaller, more manageable ones. For example, split components in src/components (like AggregatedAlarmsTable.vue) into smaller, focused pieces.

using ESLint and Prettier to enforce consistent code formatting across the project.

Regularly review and clean up the codebase by removing unused code, reducing redundant functions, and improving variable naming.

Optimizing the Performance:- Lazy load large components, especially in views like GlobalReport.vue and NetworkTopology.vue, to enhance the page load time.and
using Vuex more efficiently for state management, ensuring only necessary data is fetched and reducing unnecessary re-renders.
Compress images and assets under the assets/imgs folder to improve load times without compromising quality.

Improve Error Handling and Logging by
Implement more granular error handling across components. For example, in components like IypApi.js or GripApi.js, ensure errors are caught and communicated properly.
Implement more detailed logging, especially in the API integration points (IhrApi.js, IodaApi.js), to help track issues effectively.

Add more unit and integration tests for components and functions, especially in areas related to core functionality like charts, API data fetching, and rendering. using Jest or Mocha to test JavaScript components.
Regularly run tests to ensure all new commits don't break existing functionality.

User Experience Improvements--
Focusing on UI/UX refinements in components like Footer.vue or Header.vue. Ensure smooth transitions, clear navigation, and accessibility improvements (e.g., adding aria-labels).
Improve error messages and feedback mechanisms in pages like BGPMonitor.vue and GlobalReport.vue, guiding users when there’s an issue with data display or API calls

By focusing on these areas, i think we can maintain a high standard for the IHR website codebase, ensuring it remains efficient, user-friendly, and secure.

[dpgiakatos]

Hello,

Your suggestions are good, but I believe they may be too extensive for a single GSoC project, considering the implementation time and our past experience with project management. It might be helpful to include a prioritized list of your proposed changes in your proposal. This list could outline the changes you plan to address during the GSoC project (if selected) and another list for future work.

Before proceeding with your proposal, please wait for the official GSoC 2025 ideas announcement from our organization. Once the ideas are announced, it would be a good idea to seek feedback from us before you officially submit your proposal.

I also want to mention that we want to refactor the current method of displaying data in the tables. We have a component that we reuse in every widget, but we want to change this implementation to include the table directly in the code of each widget, rather than reusing the same table component.

Thank you.