I haven’t posted in a little while.

I’m mostly done with the next article I was supposed to post, which is about getting WebRTC working for video chats through the website. But before I could post it, I decided to redesign the whole site.

I’m partway through it right now, so I don’t have anything to show yet. I’ll write a series of posts about the redesign once it launches, but I’ll talk a little about the effort right now.

Backend

I use Go on the server for this project. I’ve been using Node (Javascript) on the backend for years whenever I did web projects, but I made speed/efficiency the highest priority for everything on this server, so I choose Go for my own code and Go projects for the other stuff I’m using (analytics, code repo, IRC server, etc).

But I wrote the first line of Go code back in January when I started the project (before I even knew all the stuff I wanted to add) and have been rapidly adding features since. I’m at 155 releases/deployments since January, and the site is on version 6.6.2 (I try to stick to semver even for this, so major.minor.patch releases).

At this point, the code is a complete mess.

Issues

Bad project architecture

Here’s a breakdown of the lines of code1 for this web project:

───────────────────────────────────────────────────────────────────────────────
Language                 Files     Lines   Blanks  Comments     Code Complexity
───────────────────────────────────────────────────────────────────────────────
HTML                        99      5590      686         1     4903          0
JSON                        42     10927        0         0    10927          0
Go                          34      9565     1275        19     8271       1417
SVG                         33     61037        8        28    61001          0
CSS                         20      8096     1321       346     6429          0
SQL                         18       435       35         0      400          0
JavaScript                  11      7598      818       766     6014       1284
Plain Text                   2        58        9         0       49          0
Makefile                     1        27        7         0       20          0
Markdown                     1         7        3         0        4          0
gitignore                    1        71       17        21       33          0
───────────────────────────────────────────────────────────────────────────────
Total                      262    103411     4179      1181    98051       2701
───────────────────────────────────────────────────────────────────────────────
Estimated Cost to Develop $3,331,347
Estimated Schedule Effort 21.727494 months
Estimated People Required 13.621541
───────────────────────────────────────────────────────────────────────────────
Processed 14319092 bytes, 14.319 megabytes (SI)
───────────────────────────────────────────────────────────────────────────────

Most of the code is in one big Go package called “handlers”. Out of the 9,565 lines of Go, 9,487 of them are in the handlers package. 😕

Go Templates

Not only are the Go files a mess, but there are 99 html files in the project. 98 of them are in one templates directory. 😕😕

And I didn’t really know Go template best practices at the time so there is NO code reuse or partials or anything like that.2

Frontend

Like with the backend, I’m not using any frameworks or libraries on the frontend. Just raw CSS/Javascript (with a minor goal of having every single feature besides video chat work with Javascript disabled).

That part isn’t such a problem on the frontend, but the general design I’m using is.

When I started this in January, the only thing I knew for sure was that I was going to post articles and pictures. I hadn’t made the decision to do freelance development yet, I had no plans for user accounts, web tools, video chat, or anything else.

The design you’re seeing right now has been updated a lot this year, but the foundations are the same: A couple links at the top of the page, an ineffective list of “More Links” on the side of the home page, and a mostly one column layout for everything else.

But this design has existed through the introduction of the following features:

Clearly a new design is needed.

Other Frontend Issues

Progress

As of this writing, I’ve completely rewritten the backend (the page routes and queries and everything are the same, so functionality should HOPEFULLY be exactly the same) to be clearer, more organized, and more efficient.

Now I’m working through the frontend. I’m in the middle of rewriting pretty much every template files. And I basically deleted all of the CSS so I can start over.

Here are the lines of code right now:

───────────────────────────────────────────────────────────────────────────────
Language                 Files     Lines   Blanks  Comments     Code Complexity
───────────────────────────────────────────────────────────────────────────────
Go                         120     11828     1662       264     9902       1370
HTML                       104      5611      693         1     4917          0
JSON                        42     10927        0         0    10927          0
SVG                         33     61037        8        28    61001          0
CSS                         19      5965      918       217     4830          0
SQL                         19       547       39         1      507          0
JavaScript                  11      7598      818       766     6014       1284
Plain Text                   2        58        9         0       49          0
Makefile                     1        27        7         0       20          0
Markdown                     1         7        3         0        4          0
gitignore                    1        71       17        21       33          0
───────────────────────────────────────────────────────────────────────────────
Total                      353    103676     4174      1298    98204       2654
───────────────────────────────────────────────────────────────────────────────
Estimated Cost to Develop $3,336,806
Estimated Schedule Effort 21.741015 months
Estimated People Required 13.635374
───────────────────────────────────────────────────────────────────────────────
Processed 14321306 bytes, 14.321 megabytes (SI)
───────────────────────────────────────────────────────────────────────────────

Some interesting things I’ve noticed so far:

That’s it for now. I’ll write another breakdown closer to release. I’m gonna dive back in now and get this done.


  1. I used github.com/boyter/scc for this. ↩︎

  2. Honestly, my Go template usage was disgusting. I wasn’t using any template functions at all, just passing blobs of string data. I have copied/pasted HTML all over the place. I wasn’t even caching the parsed templates. Ugh. ↩︎

  3. I don’t know how this is calculated. I’m gonna read more about it after I publish this. It’s interesting though now that I’ve been freelancing and tracking (and charging for) my time, I’ve been thinking a lot about the many hours I put into this project and how much it actually costs. It’s nice to get a rough estimate. ↩︎