Category Archives: coding

Difference between visibility hidden vs display none

I spent almost an entire day on this, so wanted to share the information in case it might be helpful for others. We at times need to remove a DOM object (textbox/ label/ dropdown etc) from the UI. For which we use two things object.style.visibility=”hidden” and object.style.display=”none”. Though both of them can remove the object from UI, yet there is a significant difference between these two approaches. Whereas visibility hidden will “hide” the object, it will still leave the object on the UI (in hidden format). On the other hand display=”none” will completely remove the object from UI.

The differentiation is more important in a case, where the css being used here does not specify the x and y coordinates for DOM objects, it instead places one object after another. So the trick here is, if I make an object invisible by hiding it (visibility=”hidden”), it will still occupy that one space in the flow, and a blank cell will appear on the screen. Whereas if display is none, then the next object will take place of this object and hence no empty spaces are shown on the screen.

So both the approaches can be used as per ones requirement

Redundancy Vs. Reuse

We faced a typical software engineer problem recently, that should we have multiple copies of similar code? Obvious answer is “NO”

But Lets say, you are dealing with multi hundred thousand lines of code. There is a pressure of deadline. You know that there are already some module which is providing the similar solution as you want, and just adding one if else, and making some tweaking in that code will save you from writing hundreds of lines of code. Isn’t it tempting to do that.

Ideally, we would like to get that code which is common in both cases to some common util area, where both modules can use it. Moreover, future coders will get help if they face the similar situation. But again, that is ideal solution. Here we are talking about deadlines. We don’t have time to do this activity creation of this common util stuff is a task in itself.

Second best, which I would recommend, is to copy the code to your module and use. Concern- we have two copies of same code. hundreds of lines of code which is duplicated. I would argue, better duplicate then undauntedly dependent. Why to make two mutually exclusive units dependent. What if I want to delete one module completely tomorrow, how and “why” to think that some file somewhere might be used by some other module.

What say?