[C4GT] Rendering Optimisation

[geeky-abhishek]

Project Details

UCI is created with a vision to make the conversation flow creation configurable to a level, that it can be done by program owners, without the intervention of any engineers at all. At the same time, it also envisions reducing the redundant coding required for enabling the same business logic for different channels.

UCI aims to democratize the use of different communication channels such as WhatsApp, Telegram, SMS, email and more across all governance use cases.

UCI is being used to create 2 ways communication channels via chatbots between lakhs of teachers in Uttar Pradesh & the state. These chatbots are configured from an admin panel and trigger notifications to the teachers. Teachers then click on the notifications on their Android phones and talk to the chatbot. This is making day to day communication realtime & very effective between teachers and the state.

UCI-WEB-CHANNEL is a frontend application which uses UCI backend for communication.

Features to be implemented

Optimize the rendering of components and first load.

• Next build configuration Next build configuration #76
• Stabilise socket connection
• use memoized components ,values (useMemo) and function (useCallback) instead of normal variable and function for rendering optimization. Adding to the above always use memorised values (useMemo) and function (useCallback) instead of normal variable and function for rendering optimization #83
  • More and more of HOCs
• Show Socket Offline warnings & Reconnect option
• Incorporating streaming and suspense (SSR and lazy loading) into the user interface. Incorporating streaming and suspense (SSR and lazy loading) into the user interface #80
• Rendering Optimisation - Reduce First load
• Bundle size evaluation Bundle size evaluation #81

Complexity

Medium

Skills Required

Javascript, Typescript, React ,Next Js ,Socket ,@next/bundle-analyzer

Name of Mentors:

@geeky-abhishek

Project size

4 Weeks

Product Set Up

Acceptance Criteria

• first page should be loaded in 3 seconds in slow internet connection
• first load size should be less than 5mb
• No build size warning should be logged while building the app

C4GT

This issue is nominated for Code for GovTech (C4GT) 2023 edition.
C4GT is India's first annual coding program to create a community that can build and contribute to global Digital Public Goods. If you want to use Open Source GovTech to create impact, then this is the opportunity for you! More about C4GT here: https://codeforgovtech.in/

[Tushar-go]

Hi @geeky-abhishek I am interested to contribute in this project