paint-brush
Static vs Dynamic Website — What’s the Difference in 2019?by@denis_76136
13,218 reads
13,218 reads

Static vs Dynamic Website — What’s the Difference in 2019?

by Denis KostrzewaJanuary 22nd, 2019
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Lately, there has been a lot of talk across the dev community related to traditional <a href="https://hackernoon.com/tagged/web-development" target="_blank">web development</a> and how things are shifting in a certain direction. Static websites are back, big time!&nbsp;<br>Thanks to modern web architecture like <strong>JAMstack,</strong> static websites are becoming a better solution for web developers.

Companies Mentioned

Mention Thumbnail
Mention Thumbnail

Coin Mentioned

Mention Thumbnail
featured image - Static vs Dynamic Website — What’s the Difference in 2019?
Denis Kostrzewa HackerNoon profile picture


Lately, there has been a lot of talk across the dev community related to traditional web development and how things are shifting in a certain direction. Static websites are back, big time! Thanks to modern web architecture like JAMstack, static websites are becoming a better solution for web developers.

For quite a while, I’ve been trying to spread the word about JAMstack, simply because I have been relying on its architecture and the JAMstack in general, due to its many advantages. Gradually focusing on JAMstack improved my workflow and dev process but more importantly, it helped me to leave the problems of standard web-server centric architectures behind.

What is JAMstack Anyway?

JAMstack — JavaScript, APIs, and Markup — Landscape

JAMstack stands for JavaScript, APIs, and Markup. The delightful abbreviation was introduced by Mathias Biilmann, the CEO of Netlify. The best way to describe it is: utilizing slick, modern development architecture, which offers all the advantages of a static website, but also features benefits of a dynamic database-centric CMS. I won’t bug you with an in-depth explanation but in case you are interested in a more thorough explanation check this link.

My JAMstack Experience

The best way to prepare yourself for what’s to come is to make yourself able to learn and adapt quickly. I have learned that the hard way and it prompted me to step out of my web development comfort zone and explore rising trends. One of the biggest advantages of JAMstack that became obvious to me straight away was the super low cost. Apart from that, there are other tremendous advantages and those advantages are already very well known to many:

  • Affordability: My budget was tight and focused on various aspects of the project and even so, I had a strong desire to improve how I code; in short, any unnecessary server and bandwidth costs were a pain and nuisance. By making the transition to JAMstack, my infrastructure expenses were reduced significantly.
  • Simplicity: With JAMstack things are simple. It’s simple for devs to set up, and there are very few moving parts, as such, there is less room for an error and screw-ups.
  • Security and reliability: Specific APIs are now used and the mistakes that I make are very rare indeed. The absence of server-side and database operations means additional security and immunity to SQL injection.

JAMstack vs LAMP stack & MEAN stack

JAMstack vs LAMP stack & MEAN stack

One of the additional benefits of JAMstack is that provides an extremely practical and effective alternative to LAMP and MEAN stacks. With LAMP stack being useful back during the early 2000s, it was comprised of open-source components, which many devs used to construct websites (PHP language, Linux OS, the Apache HTTP Server, and the MySQL RDBMS). Come 2013, the MEAN stack arrived and it included MongoDB, Express.js, Angular.js, and node.js.

The point I’m trying to make here is that the MEAN stack was a considerable improvement upon LAMP stack mainly because it offered flexibility and a better environment for a SPA and it supported a NoSQL database. Additionally, it featured a single language — JavaScript. This language was utilized for communication between front-end and back-end functions. Similar to the LAMP stack, the MEAN stack distinguished between the view and model layer.

To cut to the chase, LAMP was reliable, but it was reliable back in the day, and MEAN stack was an improvement. Both conventional systems can now be swiftly replaced by the speedy and more modern system such as the JAM stack.

Static Web Pages vs. Dynamic Web Pages

Dynamic Websites

It is a long-running practice to rely on dynamic websites in the current Web development scene, primarily due to the fact that you get plenty of customization, simple updating and so on. You can really easily make complex pages. However, all of this comes at a high price.

The truth of the matter is that a majority of dynamiс websites are liable to drain system resources because it denotes the incorporation of web-server and database.

Also, a conventional database-driven CMS (think WordPress, Drupal etc.) with third-party plugins is vulnerable to malicious attacks from many endpoints. Keeping all these moving parts is mandatory if you aim at keeping your website safe.

Static Websites

I’ve come to realize over the years that static websites have significant advantages denote ready web-pages (HTML and JS) that are downloaded and kept on the server. In this day and age, lack of speed and huge load times is a disadvantage you cannot afford. With mobile-first indexing and page speed as one of the top ranking factors, it is easy to understand why for websites or online business of any kind it’s like shooting yourself in the foot.

Static websites will grant you greater performance overall and a drastic reduction of load times — not to mention, better resistance to hacker attacks. As a result, using static websites can lead you to better functionality and easier maintenance.

They do not have long load times and any devs who are working on it won’t have a hard time to set them up. Also, it is easy to include diverse forms, payments or authentication if needed. You can do this by utilizing ubiquitous APIs.

What’s on the Horizon

JAMstack certainly streamlined my development process a great deal last year, but things don’t stop there. For those of you that are not into knowhow, after all said and done, why should you resort to JAMstack?

For one thing, it’s a pretty solid strategy to have when it comes to SEO. Google and other powerful search engines prefer static websites, seeing as they load very fast. What’s more, Google is constantly motivating site owners to incorporate Accelerated Mobile Pages (AMP), and that particular open-source effort is generally static in nature (equivalent to the dynamic pages on the desktop). On the development side, PWAs (Progressive Web Apps) are gaining momentum. Afterall with mobile web taking over from desktop publishers are opting out to bring native-like experience to users on all platforms and all devices.

I really hope I’ve given you some insight about how this particular system is valuable if you want to improve your workflow as a web developer. I will most certainly continue my journey with JAMstack, so stay put.