Search code examples
javascripttypescriptnpmpackageglidejs

How can I improve on reading large codebases?

I've been programming for a bit now I'm not that new but sometimes I cant seem to understand code that I read there isn't anything that specific but, for context I have only created web apps never tried to create a library or anything wanted to get started with things that I use for example https://github.com/glidejs/glide/tree/master/src is a carousel library which is something I've done before on my own but I cant seem to understand the library or read it to understand what does it offer differently from creating my own carousel.

TLDR How can I improve on reading large codebases(mostly unfamiliar) how to digest it properly, what should I look for, or its basically just a skill issue and I need just to get better?

Solution

  • Understanding a completely new codebase is something challenging for everybody, even senior developers. The way I personally approach it is when, for example, checking out something in GitHub.

    1. Look for contribution guidelines or any other documentation (usually markdown files). These sometimes explain how to configure your dev env and run the project on your machine.

    2. Try to follow the code from the root. This is usually /src/index.js or something similar. Then, follow the call stack or the imports to get an idea of what parts are calling other parts. You can create a class diagram or a module import diagram to get a better picture in your head.

    3. To understand the details of one particular function, class or method. Search for calls to such a method or function and check what is passed as an argument. A very good place to look is in the unit tests (if available). If the code base uses a statically type programming language things will be easier because the types are a form of documentation. For example, factory(settings) { is harder to understand than factory(settings: { width: number, height: number }): HtmlCanvasElement {.

    4. Run the project locally and introduce breakpoints or console log calls. Experiment with changing the code and exploring what kind of impact those changes cause.

    5. You can ask an AI to explain the source code.

    You will get more comfortable as you become more experienced but there are no silver bullets here. The better the project, the more resources will be available to help you (docs, unit tests, type definitions, discord groups...).