Download as pdf or txt
Download as pdf or txt
You are on page 1of 70

Frameworkless Front-End Development

: Do You Control Your Dependencies or


are They Controlling You? 2nd Edition
Francesco Strazzullo
Visit to download the full and correct content document:
https://ebookmeta.com/product/frameworkless-front-end-development-do-you-control-
your-dependencies-or-are-they-controlling-you-2nd-edition-francesco-strazzullo/
More products digital (pdf, epub, mobi) instant
download maybe you interests ...

Frameworkless Front-End Development: Do You Control


Your Dependencies Or Are They Controlling You? 1st
Edition Francesco Strazzullo

https://ebookmeta.com/product/frameworkless-front-end-
development-do-you-control-your-dependencies-or-are-they-
controlling-you-1st-edition-francesco-strazzullo/

It Starts with Passion Do What You Love and Love What


You Do Be Your Best 2nd Edition Abraham

https://ebookmeta.com/product/it-starts-with-passion-do-what-you-
love-and-love-what-you-do-be-your-best-2nd-edition-abraham/

Modern Front-end Architecture: Optimize Your Front-end


Development with Components, Storybook, and Mise en
Place Philosophy 1st Edition Ryan Lanciaux

https://ebookmeta.com/product/modern-front-end-architecture-
optimize-your-front-end-development-with-components-storybook-
and-mise-en-place-philosophy-1st-edition-ryan-lanciaux/

Are You Fired up or Burned Out 1st Edition James W.


Moore

https://ebookmeta.com/product/are-you-fired-up-or-burned-out-1st-
edition-james-w-moore/
High On You (As You Are #2) 1st Edition Hailey Smoke

https://ebookmeta.com/product/high-on-you-as-you-are-2-1st-
edition-hailey-smoke/

Modern Front End Development for Rails 1st Edition Noel


Rappin

https://ebookmeta.com/product/modern-front-end-development-for-
rails-1st-edition-noel-rappin/

Dog Training Discover The Top 7 Things You Need To


Teach Your Dog So They Are Peaceful And Disciplined 1st
Edition Old Natural Ways

https://ebookmeta.com/product/dog-training-discover-the-
top-7-things-you-need-to-teach-your-dog-so-they-are-peaceful-and-
disciplined-1st-edition-old-natural-ways/

Do What You Are Discover the Perfect Career for You


Through the Secrets of Personality Type Tieger Paul D
Barron Barbara Tieger Kelly

https://ebookmeta.com/product/do-what-you-are-discover-the-
perfect-career-for-you-through-the-secrets-of-personality-type-
tieger-paul-d-barron-barbara-tieger-kelly/

The Nones Where They Came From Who They Are and Where
They Are Going 2nd Edition Ryan P. Burge

https://ebookmeta.com/product/the-nones-where-they-came-from-who-
they-are-and-where-they-are-going-2nd-edition-ryan-p-burge/
Francesco Strazzullo

Frameworkless Front-End Development


Do You Control Your Dependencies or are They
Controlling You?
2nd ed.
Francesco Strazzullo
TREVISO, Treviso, Italy

ISBN 978-1-4842-9350-8 e-ISBN 978-1-4842-9351-5


https://doi.org/10.1007/978-1-4842-9351-5

© Francesco Strazzullo 2019, 2023

This work is subject to copyright. All rights are solely and exclusively
licensed by the Publisher, whether the whole or part of the material is
concerned, specifically the rights of translation, reprinting, reuse of
illustrations, recitation, broadcasting, reproduction on microfilms or in
any other physical way, and transmission or information storage and
retrieval, electronic adaptation, computer software, or by similar or
dissimilar methodology now known or hereafter developed.

The use of general descriptive names, registered names, trademarks,


service marks, etc. in this publication does not imply, even in the
absence of a specific statement, that such names are exempt from the
relevant protective laws and regulations and therefore free for general
use.

The publisher, the authors, and the editors are safe to assume that the
advice and information in this book are believed to be true and accurate
at the date of publication. Neither the publisher nor the authors or the
editors give a warranty, expressed or implied, with respect to the
material contained herein or for any errors or omissions that may have
been made. The publisher remains neutral with regard to jurisdictional
claims in published maps and institutional affiliations.

This Apress imprint is published by the registered company APress


Media, LLC, part of Springer Nature.
The registered company address is: 1 New York Plaza, New York, NY
10004, U.S.A.
To Alessandro, my son.
The Frameworkless Movement
This book is about two main topics. The first is about working without
frameworks effectively; the second is about choosing the right
framework for the right project. My friends Antonio Dell’Ava, Lorenzo
Massacci, Alessandro Violini and I created the Frameworkless
Movement1 to explore these topics better.

This movement aims to create awareness around these topics, gathering


people together in a community. Our main concern is to help people
understand that working without a framework is a real possibility
nowadays. This book is part of our group’s activities to help people
understand the importance of technical decision-making. If you’re
interested and want to be involved, contact us on GitHub.2
Any source code or other supplementary material referenced by the
author in this book is available to readers on GitHub
(https://github.com/Apress). For more detailed information, please
visit https://www.apress.com/gp/services/source-code.
Acknowledgments
This book was born drinking coffee with my dear friend Lorenzo
Massacci. During a coffee break in the office, he asked, “What does it
take to make an application last forever?” We never answered that
question, but we started thinking about the lifespan of applications and
their relationship with frameworks, and we started talking about the
frameworkless approach.
I also need to thank Avanscoperta,3 who helped me prepare my
“Frameworkless Front-end Development” workshop and gave me
feedback about the frameworkless approach from the attendees, giving
me the courage to write down my thoughts.
The last “thank you” goes to my wife Lucia. She does not know
anything about JavaScript or frameworks, so she couldn’t actually help
me write this book. But she does a more important thing. She makes me
happy.
Table of Contents
Chapter 1:​The Definition of Framework
Frameworks vs Libraries
Comparing Frameworks to Libraries
Frameworks and Decisions
Angular’s Decisions
The Framework’s Way
Frameworks as Technical Debt
Technical Investment
Summary
Chapter 2:​Brief History of Front-end Frameworks
The First Age:​jQuery
The jQuery’s Way
The Second Age:​AngularJS, Backbone, and Ember
AngularJS
The Third Age:​React, Angular, and Vue
Angular
React
Comparing Angular and React
Bonus Tracks
Web Components
Svelte
Next.​JS
Summary
Chapter 3:​Rendering
The Document Object Model
Monitoring Rendering Performance
Chrome Developer Tools
The stats.​js Widget
Custom Performance Widget
Rendering Functions
TodoMVC
Rendering Pure Functions
Rendering Dynamic Data
The Virtual DOM
Summary
Chapter 4:​Managing DOM Events
The YAGNI Principle
The DOM Events API
Attach Handlers with Properties
Attach Handlers with addEventListener​
The Event Object
The DOM Event Lifecycle
Using Custom Events
Adding Events to TodoMVC
Reviewing the Rendering Engine
A Basic Event-Handling Architecture
Event Delegation
Summary
Chapter 5:​Web Components
The APIs
The Custom Elements API
Using Web Components for TodoMVC
Web Components vs Rendering Functions
Code Style
Testability
Portability
Community
Disappearing Frameworks
Summary
Chapter 6:​HTTP Requests
A Bit of History:​The Birth of AJAX
A To-Do List REST Server
Representational​State Transfer (REST)
Code Examples
The Basic Structure
XMLHttpRequest
Fetch
Reviewing the Architecture
Summary
Chapter 7:​Routing
Single Page Applications
Code Examples
Fragment Identifiers
The History API
Navigo
Choosing the Right Router
Summary
Chapter 8:​State Management
Reviewing the TodoMVC Application
Model View Controller
Observable Model
Reactive Programming
A Reactive Model
Native Proxies
Event Bus
A Frameworkless Implementation
Redux
Comparing State Management Strategies
Model View Controller
Reactive Programming
Event Bus
Summary
Chapter 9:​Frameworkless Refactoring:​StranglerFigAppl​ication
Pattern
Setting the Stage
The Solution
The Example
The Original Application
Moving Services
Moving Components
Other Conversion Strategies
iframes
Proxy
Summary
Chapter 10:​Defending from Frameworks
Classify Framework Features
Rendering/​Event Management
HTTP Request
Routing
State Management
Visualizing Your Strategy
Summary
Chapter 11:​The Right Tool for the Right Job
JavaScript Fatigue
The “Right” Framework
The Frameworkless Manifesto
The First Principle
The Second Principle
The Third Principle
The Fourth Principle
Tools
Matteo Vaccari’s Tool
Trade-off Sliders
Architecture Compass Chart
Other Tools
Summary
Index
About the Author
Francesco Strazzullo
is an experienced front-end engineer,
JavaScript trainer, developer, and chief
operating officer at Claranet Italy. He has
presented at tech conferences and meet-
ups around Europe. Francesco is a
technical reviewer for multiple tech
publishers and writes technical articles
on his blog. He is always enthusiastic
about trying out new APIs, and he firmly
believes that the best way to learn
something new is to explain and teach it
to somebody else. With friends and fellow developers, he founded the
Frameworkless Movement, a group interested in developing software
without using frameworks and spreading knowledge about making
informed decisions about the choice and use of frameworks in front-
end software development.
About the Technical Reviewers
Giorgio Boa
is a full stack developer; the front-end
ecosystem is his passion. He started
developing applications in 2006, and in
2012 he fell in love with JavaScript. He is
also active in the open-source
ecosystem; he loves to learn and study
new things. He is very ambitious and
tries to improve himself every day.

Luca Del Puppo


is a senior software engineer who loves
JavaScript and TypeScript. In his free
time, he enjoys studying new
technologies, improving himself, creating
YouTube content, and writing technical
articles. He can’t live without trail
running and loves doing it in his beloved
Dolomites.
Footnotes
1 http://frameworklessmovement.org

2 https://github.com/frameworkless-movement/manifesto

3 www.avanscoperta.it/en/training/
© The Author(s), under exclusive license to APress Media, LLC, part of Springer
Nature 2023
F. Strazzullo, Frameworkless Front-End Development
https://doi.org/10.1007/978-1-4842-9351-5_1

1. The Definition of Framework


Francesco Strazzullo1
(1) TREVISO, Treviso, Italy

You don't need a framework. You need a painting, not a frame.


—Klaus Kinski

If you are reading this book, you are probably interested in learning
how to develop complex applications without relying on—or without
relying too much on—front-end frameworks.
It would not be smart to start exploring frameworkless solutions
without first exploring the meaning of “framework.” Consider the first
definition of framework by the Cambridge Dictionary:1

A supporting structure around which something can be built.

This first and simple definition is consistent with the general idea of
a software framework. Think about Angular:2 it gives you, out-of-the-
box, a structure that “supports” your application and a series of
elements, like Services, Components and Pipe, that can be used to
build your applications. However, this simplistic definition is not the
only possibility. Let’s analyze the definition of framework from other
points of view.

Frameworks vs Libraries
It may seem counterintuitive, but a way to easily define frameworks is
to highlight their differences from another important part of every
codebase: libraries. Without overthinking it, it is safe to say that
Angular is a Framework while lodash is a library. You can instantly tell
the difference between the two tools because of this other definition3 of
framework:

A framework calls your code, your code calls a library.


A framework could internally use one or more libraries, but that fact
is usually hidden from the developer, who sees the framework as a
single unit, or a bunch of modules if you choose a modular framework.
The relationship among application code, frameworks, and libraries can
be condensed, as shown in Figure 1-1.

Figure 1-1 Relationship among frameworks, libraries, and application code

Comparing Frameworks to Libraries


This section provides several code snippets that illustrate the difference
between frameworks and libraries. This comparison uses Angular and
date-fns.4
Listings 1-1 and 1-2 are basic examples of Component and
Service in Angular.

import { Injectable } from '@angular/core'


import { HttpClient } from '@angular/common/http'
import { Observable } from 'rxjs'
import { Order } from './model/order'

const URL = 'http://example.api.com/'

@Injectable({
providedIn: 'root'
})
export class Orders {
constructor(private http: HttpClient) {}

list(): Observable<Order[]> {
return this.http.get<Order[]>(URL)
}
}
Listing 1-1 Angular Service Example

import { Component, OnInit } from '@angular/core'


import { Orders } from '../orders'
import { Order } from '../model/order'

@Component({
selector: 'app-order-list',
templateUrl: './order-list.component.html',
styleUrls: ['./order-list.component.css']
})
export class OrderListComponent implements OnInit
{
list: Order[] = []

constructor(private orders: Orders) { }

ngOnInit(): void {
this.orders.list()
.subscribe(_orders => this.list = _orders)
}
}
Listing 1-2 Angular Component Example
Listing 1-3 is an example of using date-fns to format a date.

import { format } from 'date-fns'

const DATE_FORMAT = 'DD/MM/YYYY'


export const formatDate = date => {
return format(date, DATE_FORMAT)
}
Listing 1-3 date-fns Example
The previous definition of the difference between a framework and
a library is quite striking when you analyze Listings 1-1 to 1-3. Angular
is a framework, and Orders and OrderListComponent will stop
working in a codebase without Angular. Angular is calling the
application code. If you remove the @Injectable annotation, the
service becomes invisible to the Angular code, and the Orders class
relies on the HttpClient utility to fulfil its task.
On the other hand, date-fns is not opinionated on how to
structure the application’s code; you can just import it, and if you
respect the public API, you’re good to go. Table 1-1 shows a list of
libraries grouped by their purpose.
Table 1-1 Some JavaScript Libraries

Purpose Libraries
Utilities lodash, Ramda

Date manipulation date-fns, Day.js


Data visualization D3.js, highcharts, chart.js
Animation tween.js, anime.js

Frameworks and Decisions


The Cambridge Dictionary provides another definition of framework
that is interesting to analyze:
A system of rules, ideas, or beliefs that is used to plan or decide
something.

While a “system of rules” is easy to apply to a software framework—


every API is a system of rules—the interesting part of this definition is
that a system of rules (aka a framework) could be used to decide
something. Can software frameworks be used to decide something? The
short answer is yes, but let me elaborate on a longer answer. When
teams choose to work with a framework, they are deliberately
“deciding not to decide” or, to put it in other terms, to let the framework
make some decisions for them. Delegating some decisions to another
team is not a problem per se, but it may become a problem because
these decisions are hidden in plain sight. Mindful teams should analyze
these hidden decisions they are delegating and deeply understand their
consequences.

Angular’s Decisions
To better explain how a framework can make decisions in place of a
development team, this section explains the decisions that a team using
Angular delegates to the framework.

Language
Using Angular means, first of all, using TypeScript. In the past, you
could work with plain JavaScript5 in an Angular application, but that
feature has been removed. TypeScript is a typed superset of JavaScript
that compiles to plain JavaScript. Apart from type checking, it also lets
you use some features that are not present in the original language, like
annotations.
TypeScript can be useful if you and your team are used to working
with strongly typed languages. But this also means that if you use
Angular, all of your code is written in a language that requires a
transpiler.

Observables
Angular is heavily designed around RxJS, a library for reactive
programming using observables; in fact, in the previous example, to get
the data from PeopleListService, you would have to use the
subscribe method of the Observable object. This is a very
different approach from the rest of the front-end frameworks, where
HTTP requests are designed like promises. Promises provide a
standard way to represent the eventual completion (or failure) of an
asynchronous operation. RxJS lets you easily transform an
Observable into a promise6 and vice versa. But if you need to
integrate some promise-based library into your Angular project, you
will need to do some extra work. For the sake of completeness, this is a
similar example using fetch,7 a platform API used to make HTTP
requests based on promises. See Listings 1-4 and 1-5.

const URL = 'http://example.api.com/'


export class Orders {
async list(): Promise<Order[]> {
const response = await fetch(URL)
const data = await response.json();
return data;
}
}
Listing 1-4 Angular Service without Observables8

export class OrderListComponent implements OnInit


{
list: Order[] = []

constructor(private orders: Orders) { }

ngOnInit(): void {
this.orders.list()
.then(_orders => this.list = _orders)
}
}
Listing 1-5 Angular Component without Observables
Notice that both of these constraints are not bad by themselves;
TypeScript and RxJs are both fantastic tools. But the consequences of
using these tools (forced by Angular) should be clear to the whole team.

The Framework’s Way


In these few pages, I have not mentioned the elephant in the room, the
most famous tool in the front-end ecosystem: React. This section aims
to explain whether React is a framework or a library. The definition of
React from the official website9 is as follows:
A JavaScript library for building user interfaces
It seems easy enough then—React is a library. But the reality is
much more complex than that. The main constraint of React is the use
of the declarative paradigm. You don’t manipulate the DOM, but you
modify the state of a component, and then React modifies the DOM for
you. This way of programming is also present in most of the libraries of
the React ecosystem. The purpose of the snippet in Listing 1-6 is to
hide/show a square with an animation. Every time the user presses the
Toggle button, using framer-motion,10 it activates an animation
library for React. The result is visible in Figure 1-2.

import { useCallback, useState } from 'react';


import { motion } from "framer-motion"

const MotionExample = () => {


const [isVisible, setIsVisible] =
useState(false);
const toggle = useCallback(() =>
setIsVisible(!isVisible), [isVisible]);

const opacity = isVisible ? 1 : 0;


return (
<div>
<motion.div
className='box'
animate={{ opacity }}
transition={{
ease: 'linear',
duration: 0.5
}}
/>
<button onClick=
{toggle}>Toggle</button>
</div>
)
}
export default MotionExample
Listing 1-6 framer-motion Animation Example

Figure 1-2 Example of React animation with framed-motion

As you can see, you don’t directly animate the square. You just
declare how to map the state with the animation (changing the
opacity), and then you change the state. This is the core of the
declarative pattern used in React. Let’s analyze a different approach
using a Web Animations API,11 a standard library used to
programmatically create CSS animations. The code shown in Listing 1-7
has the same output as the previous one.

import { useCallback, useState, useEffect, useRef


} from 'react'
const animationTiming = {
duration: 500,
ease: 'linear',
fill: 'forwards'
}

const showKeyframes = [
{ opacity: 0 },
{ opacity: 1 }
]

const hideKeyframes = [
...showKeyframes
].reverse()

const show = (element) => {


element.animate(showKeyframes,
animationTiming)
}

const hide = (element) => {


element.animate(hideKeyframes,
animationTiming)
}

const WAExample = () => {


//using ref to skip a re-render
const didMountRef = useRef(false);
const box = useRef(null)
const [isVisible, setIsVisible] =
useState(false)

const toggle = useCallback(() => {


setIsVisible(!isVisible)
}, [isVisible])

useEffect(() => {
if(!didMountRef.current) {
didMountRef.current = true;
return
}

const {
current
} = box

if(isVisible){
show(current)
} else{
hide(current)
}

}, [box, isVisible])

return (
<div>
<div
ref={box}
className='box'
/>
<button onClick=
{toggle}>Toggle</button>
</div>
)
}

export default WAExample


Listing 1-7 Web Animations API Example
The example in Listing 1-6 may seem out of place for a React
developer. This is because you’re moving the square with an imperative
pattern using the animate12 method of the DOM element. The second
example is less “Reacty” than the first one. In other words, when
working with React, developers need to consider also a set of unspoken
rules imposed not by the API itself but by how the community is using
that API. React community-created libraries and tools transform
operations that could be imperative in declarative components. In
addition to the animation example in Listing 1-6, there are other
examples, such as React Router13 and Apollo Client.14
These libraries contributed to creating React’s way of writing
applications. Every mainstream framework tends to create its
framework’s way. This aspect leads to the third definition of
framework:

If there is a framework’s way, there is a framework.

So, following this definition, it becomes crystal clear that React is a


framework and not a library. You could use it as a library, but most of
the projects will embrace its unspoken rules, making it a framework de
facto.
As for the Angular rules from the previous paragraph, React’s way is
not a bad thing per se. But when embracing its declarative way of
programming, a team needs to understand what they are gaining and
what they are losing. Let’s try to do that in Listings 1-6 and 1-7. Both
snippets have a similar complexity, but Listing 1-6 is more readable for
a React developer because react-motion is React-compatible. So, a
team that decides to work like in Listing 1-7 is losing readability. But
what are they gaining? To answer this question, analyze Listings 1-8
and 1-9; they are slightly different versions of the Web Animations API
example from Listing 1-7.

const animationTiming = {
duration: 500,
ease: 'linear',
fill: 'forwards'
}

const showKeyframes = [
{ opacity: 0 },
{ opacity: 1 }
]

const hideKeyframes = [
...showKeyframes
].reverse()

export const show = (element) => {


element.animate(showKeyframes,
animationTiming)
}

export const hide = (element) => {


element.animate(hideKeyframes,
animationTiming)
}
Listing 1-8 Frameworkless Animation Library

import { useCallback, useState, useEffect, useRef


} from 'react'
import { show, hide } from './animations'

const WAExample = () => {


//using ref to skip a re-render
const didMountRef = useRef(false);
const box = useRef(null)
const [isVisible, setIsVisible] =
useState(false)

const toggle = useCallback(() => {


setIsVisible(!isVisible)
}, [isVisible])

useEffect(() => {
if(!didMountRef.current) {
didMountRef.current = true;
return
}

const {
current
} = box
if(isVisible){
show(current)
} else{
hide(current)
}

}, [box, isVisible])

return (
<div>
<div
ref={box}
className='box'
/>
<button onClick=
{toggle}>Toggle</button>
</div>
)
}

export default WAExample


Listing 1-9 Web Animations API Example (Revised)
It is easy to notice that the only difference with the previous Web
Animations API example is that I moved all the animation-related code
to a different file. But the code in Listing 1-8 now has an important
characteristic: It is completely unrelated to React. It is a simple library
without dependencies. This means that it can be used in any kind of
JavaScript project without a problem. In this scenario, the team is losing
readability but gaining portability.

Tip When ditching the framework’s way, be sure to know why you
are doing it. The loss of readability, in the long run, could be
problematic, so be sure that it is worth it.

Frameworks as Technical Debt


The last definition of framework that I want to share with you is surely
bold, even provocative:

Frameworks are technical debt.

Let me elaborate a bit on why I think that every framework is


technical debt. When you need to add a feature to a project, you always
have options. Some are quick and messy, while others are well-designed
but slower to put into production. To better understand the impact of
this kind of decision, Ward Cunningham15 created the metaphor of
technical debt. The metaphor itself is quite simple: Every time you
choose a quick solution, you incur a debt. A simple diagram of technical
debt is shown in Figure 1-3.

Figure 1-3 Technical debt

In the medium term, using a no-design approach will lead to an


increase in the cost to add a feature or to change an existing one. This
“slowness” is the unpaid debt that a team accumulates over time. When
using frameworks, a team starts accumulating the same kind of debt
but usually, the slowness comes only in the long term, after some years
of active development. In my experience, when an application is
commercially successful, its lifespan exceeds the lifespan of frameworks
used to build that application. When this happens, the framework is
treated like “legacy code,” and developers start to struggle and start to
slow down development. Just like technical debt.

Technical Investment
Usually, when I tell developers that one of the definitions of framework
is technical debt, they think I am an extremist. But I have nothing
against frameworks, and—even though I wrote this book—I use
frameworks for a large part of my job. My point is that technical debt is
not always a bad thing. In the financial world, debt is not automatically
a bad thing. For example, to buy a house, you usually get a loan, which is
debt. But people tend to not consider the loan a bad thing, but an
investment. On the other hand, if a friend of yours without a stable job
goes to the bank to get a loan to buy a Ferrari, you might try to stop
them.
The difference is not in the debt itself but in the reason behind that
debt. Software development has the same kind of mechanism; if you
use the no-design solution for a good reason, it is not technical debt,
but a technical investment. It’s always a kind of debt, but it is not
reckless. By the same token, frameworks, when chosen for a good
reason, are not costs but assets. If you use a framework as an
investment, the cost should be eventually paid.

Summary
In this first, introductory, chapter I analyzed four different definitions of
framework, and for each one, I tried to highlight what consequences
they bring to a developer’s daily life.
The next chapter covers a brief history of JavaScript front-end
frameworks.

Footnotes
1 https://dictionary.cambridge.org/dictionary/english/framewo
rk

2 https://angular.io/

3 I read this definition often in books or online, but I cannot pinpoint the original
source, if there is one.

4 https://date-fns.org/

5 You can see the breaking change in this commit


https://github.com/angular/angular/commit/cac130eff9b9cb608f2
308ae40c42c9cd1850c4d

6 “toPromise” is deprecated in favor of “lastValueFrom”


https://indepth.dev/posts/1287/rxjs-heads-up-topromise-is-
being-deprecated

7 https://developer.mozilla.org/en-US/docs/Web/API/fetch

8 In Listings 1-4 and 1-5, I removed Angular’s decorators for the sake of brevity.

9 https://reactjs.org/

10 www.framer.com/docs/introduction/

11 https://developer.mozilla.org/en-
US/docs/Web/API/Web_Animations_API
12 https://developer.mozilla.org/en-
US/docs/Web/API/Element/animate

13 https://reactrouter.com/

14 www.apollographql.com/docs/react/get-started/

15 https://youtu.be/pqeJFYwnkjE
© The Author(s), under exclusive license to APress Media, LLC, part of Springer
Nature 2023
F. Strazzullo, Frameworkless Front-End Development
https://doi.org/10.1007/978-1-4842-9351-5_2

2. Brief History of Front-end


Frameworks
Francesco Strazzullo1
(1) TREVISO, Treviso, Italy

Misunderstanding of the present is the inevitable consequence of


ignorance of the past.
—Marc Bloch

This chapter is a very brief history of front-end frameworks. It’s not


meant to be comprehensive, but it’s an opinionated view of the most
important milestones in the front-end ecosystem. I divided this chapter
into “ages” that contain one or more frameworks. For each age, I
explain the ideas that the frameworks of that age introduced to the
front-end ecosystem and which ideas are still valid today. Figure 2-1
shows the timeline of the most important frameworks in front-end
history.

Figure 2-1 Timeline of front-end frameworks


The First Age: jQuery
Created by John Resig in 2006, jQuery (see Figure 2-2) the mother of all
JavaScript frameworks. It’s by far most commonly used1 in production,
with an outstanding 77 percent of the ten million most popular
websites.

Figure 2-2 The jQuery logo

The most seminal feature of jQuery2 is the selector syntax, which


lets developers select dom nodes with a CSS selector (var element
= $('.my-class')). The same selector syntax became part of the
browsers’ platform3 in 2013.
It may seem strange that this feature became so groundbreaking
back then, but you have to consider that at that time, browsers were not
aligned as they are today. This is the real value that jQuery brought to
the front-end world. jQuery created a lingua franca between the
browsers. It helped the community grow around common ground.
Apart from the selector syntax, during that time a lot of features had
been added to the core project, like AJAX requests, animations, and
other utilities. It rapidly became the Swiss Army knife of front-end
development. Today, developers tend to joke about jQuery and its
“ugliness,” but it is the cornerstone of modern web development.

The jQuery’s Way


In the previous chapter, I described the idea of the framework’s way. I
covered how React is more similar to a framework than a library. From
this point of view, jQuery is very similar to React: A library so
opinionated and used to become a framework. JQuery’s way became
evident in 2007 with the advent of jQueryUI,4 an official UIKit for
jQuery applications. This toolkit was easily pluggable, giving developers
ready-to-use components for every need. Thanks to the addition of the
UI part, jQuery transformed from a utility library to a full-fledged
framework. This resonated to other frameworks like AngularJS based
on jqlite.

The Second Age: AngularJS, Backbone, and Ember


jQuery gave developers a lot of freedom. Remember that—even if it has
its “framework’s way”—jQuery is a library that manipulates DOM
elements. In the late 2000s, web development frameworks emerged
with the Single Page Applications (SPAs) concept. The prominent
examples of this era of JavaScript development are AngularJS,
Backcone.js, and Ember. All these frameworks implemented the Model
View Controller (MVC) pattern or one of its variations. For the sake of
brevity, I cover only AngularJS because—in my opinion—it is the one
that most influenced the front-end community (see Figure 2-3).

Figure 2-3 The AngularJS logo

AngularJS
If jQuery can be seen as the invention of writing, AngularJS5 is probably
the equivalent of Gutenberg’s printing press. AngularJS was developed
in 2009 by Miško Hevery6 as a side project; later, he became a Google
employee. Version 1.0 went live on October 20, 2010. It reached its end-
of-life7 on December 31, 2021. AngularJS had huge success and helped
make SPAs a mainstream pattern. The main—and most infamous—
characteristic of AngularJS is its two-way data binding. Every update in
the model updates the view, and every update in the view updates the
model. A simple schema of two-way data binding is shown in Figure 2-
4.
Figure 2-4 Two-way data binding
To better understand how this mechanism works, Listing 2-1 shows
an example of ngModel, the most commonly used AngularJS construct.
The example is adapted from the official AngularJS documentation.8

<script>
angular.module('inputExample', [])
.controller('ExampleController', ['$scope',
function($scope) {
$scope.val = '1';
}]);
</script>
<form ng-controller="ExampleController">
<input ng-model="val" />
</form>
Listing 2-1 AngularJS Two-Way Data Binding Example

The value in the input element is bound to the value in


$scope.val, so the initial value is ‘1’. When the user changes the
value in the input, the value of $scope.val changes accordingly.
When this approach was presented, it generated quite a “wow effect”
and quickly became the reason that people chose to work with
AngularJS. Nevertheless, this approach started to feel “stale” after some
time. Binding the model and the view in this way is not a good option
for large codebases, where complex data transformation is needed
because overusing this technique slows down the application.
AngularJS introduced components and one-way data bindings in later
releases, but its popularity decreased, and it has been replaced by
modern frameworks.

The Third Age: React, Angular, and Vue


Enter the modern age of front-end development. While I'm writing this
chapter—in 2023—the front-end ecosystem is dominated by three
players: Angular, React, and Vue. In this case, I do not discuss the
consequences because these frameworks are still widely used today. In
this section, I analyze just the first two because I think that they
represent two different ways of thinking—in fact they are poles apart—
about front-end development.

Angular
Angular9 was previously known as Angular2 because the project was
intended to be the new version of AngularJS. The team behind the
project took semantic versioning very seriously, thus Angular2 was a
completely different framework, as you saw in the previous pages. Such
a different approach between the two versions caused a wave of panic
around the project. After the first release of Angular2 in September
2016, the team decided to rename the project Angular (see Figure 2-5).
Figure 2-5 The Angular logo

Thanks to a collaboration between Google and Microsoft, its


development seemed quite troubled initially. At first, Angular’s team
announced that the framework used AtScript,10 a dedicated language
created specifically for Angular. Later, the team switched to TypeScript,
a new language developed by Microsoft. Angular was built with
corporate companies in mind. With the advent of AngularJS, many
companies created SPAs thanks to the framework. But AngularJS was
not ready for huge codebases. The use of TypeScript, ideas borrowed
from other ecosystems—such as annotations for dependency injection
—and stable release planning are probably the main reasons behind
the success of Angular.

React
React11 (see Figure 2-6) was created internally at Facebook in 2011 and
released publicly in 2013. React made the concept of the “component”
mainstream in the front-end ecosystem, probably thanks to the
adoption of JSX, which lets developers use HTML tags in JavaScript files.

Figure 2-6 The React logo


Another React characteristic that changed the way people work
with data in front-end applications was one-way data binding, also
thanks to external libraries like Redux. This approach was
revolutionary at the time compared to AngularJS’ standard two-way
data binding. Thanks to React and its community concept, data
immutability became widely used in the front-end ecosystem.

Comparing Angular and React


At the beginning of this section, I said that Angular and React are poles
apart. Nevertheless, they are constantly compared in talks, blog posts,
and so on. I usually find these comparisons quite unuseful because they
don’t give readers a complete picture. I do not compare them in this
paragraph, but I do highlight the most important difference between
the two frameworks. Angular is built “in a laboratory” with the purpose
of becoming a popular framework, while React is created and
maintained mostly by Facebook to solve its problems. This “political”
aspect is reflected in the structure of the two frameworks. On one hand,
Angular may feel “too big” and almost bloated for some scenarios, but it
has a stable API and a defined roadmap.
On the other hand, React is smaller and leaner and thus easier to
integrate with custom or existent code. But React’s API is less stable
between versions compared to Angular. The advent of hooks12
completely changed the way React applications are built; this aspect
instills fear in some companies that require stability in the tools that
they use.

Bonus Tracks
In this last section of this chapter, I briefly cover some other
technologies that did not (yet) have the same impact on the front-end
ecosystem, but that I find interesting, nevertheless.

Web Components
Not a framework, but a significant step in front-end history, web
components are a set of native APIs that let developers build custom
HTML components without any dependencies. They were introduced to
the public by Alex Russell at the Frontiers Conference in 2011.13 In the
last period, libraries like Lit or Stencil are becoming more common
in front-end ecosystems because they improve and make it easier to
build WebComponent. Chapter 4 covers them deeply, explaining how
to leverage them to create UI components.

Svelte
The “disappearing frameworks” way has become a recent phenomenon
in the front-end ecosystem. In this category, frameworks are reactive by
design. During the compilation process, the framework translates
syntax in vanilla JavaScript to be lightweight and fully reactive at
runtime, so the library payload effectively “disappears” apart from
some core functions. The most famous framework in this category is
Svelte (see Figure 2-7).14
Figure 2-7 The Svelte logo
Apart from the fact that you don’t serve the whole library payload, a
vanilla JavaScript approach is a great way to inject Svelte into existing
applications. As you will see in Chapter 4, the main advantage of web
components is that they act exactly as standard HTML elements,
making this kind of integration frictionless.

Next.JS
From a high-level point of view, single page applications (SPAs) are just
empty pages until the JS Framework kicks in and starts rendering
content. This approach is unsuitable for SEO because spiders can’t
grasp the content of JS-generated elements. React enabled server-side
rendering (SSR), but doing SSR with pure React on a node server is
quite cumbersome. Next.JS15 solves this problem with an all-in-one
solution that builds an SSR-ready application and the possibility to
build a set of REST APIs within the same project of the React
application. Thanks to the acquisition by Vercel,16 it is possible to
deploy a working React application (with SSR) in minutes. See Figure 2-
8.
Another important concept built in to Next.JS is ISR17 (incremental
static render). This approach allows building and keeping one or more
pages in the cache for a specific time. The system rebuilds the page with
the new data at expiration, and the cycle continues until the server
runs. This approach permits you to reduce the cost of the page’s
creation and the cost of the computation on the server. It’s also possible
to re-create pages on demand if you need them before the cache
expires.

Figure 2-8 Next.JS logo

Summary
This chapter summarized a very brief history of front-end
development, highlighting the tools that I find are the most important
and “seminal” in the recent past. I also pointed out some frameworks
that I think are worth watching and analyzing for their growth.
The next chapter covers the frameworkless way to build a rendering
engine.
Footnotes
1 https://w3techs.com/technologies/overview/javascript_librar
y

2 https://jquery.com/

3 https://developer.mozilla.org/en-
US/docs/Web/API/Document/querySelector

4 https://jqueryui.com/

5 https://angularjs.org/

6 https://en.wikipedia.org/wiki/AngularJS#Development_history

7 https://blog.angular.io/discontinued-long-term-support-for-
angularjs-cc066b82e65a

8 https://docs.angularjs.org/api/ng/directive/ngModel

9 https://angular.io/

10 The name “AtScript” comes from the @ (“at”) symbol used for annotations in
many languages and frameworks, like Java Spring.

11 https://reactjs.org/
12 https://reactjs.org/docs/hooks-intro.html

13 https://fronteers.nl/congres/2011/sessions/web-components-
and-model-driven-views-alex-russell

14 https://svelte.dev/

15 https://nextjs.org/

16 https://vercel.com/

17 https://nextjs.org/docs/pages/building-your-
application/data-fetching/incremental-static-regeneration
Another random document with
no related content on Scribd:
armies were in the field, and the quick and signal triumph of
its forces on land and sea bore equal tribute to the courage
of American soldiers and sailors and to the skill and
foresight of Republican statesmanship. To ten millions of the
human race there was given 'a new birth of freedom,' and to
the American people a new and noble responsibility.

"'We indorse the Administration of William McKinley. Its acts


have been established in wisdom and in patriotism, and at home
and abroad it has distinctly elevated and extended the
influence of the American nation. Walking untried paths and
facing unforeseen responsibilities, President McKinley has
been in every situation the true American patriot and the
upright statesman, clear in vision, strong in judgment, firm
in action, always inspiring and deserving the confidence of
his countrymen. In asking the American people to indorse this
Republican record and to renew their commission to the
Republican party, we remind them of the fact that the menace
to their prosperity has always resided in Democratic
principles, and no less in the general incapacity of the
Democratic party to conduct public affairs. The prime
essential of business prosperity is public confidence in the
good sense of the Government, and in its ability to deal
intelligently with each new problem of administration and
legislation. That confidence the Democratic party has never
earned. It is hopelessly inadequate, and the country's
prosperity when Democratic success at the polls is announced
halts and ceases in mere anticipation of Democratic blunders
and failures.

"We renew our allegiance to the principle of the gold


standard, and declare our confidence in the wisdom of the
legislation of the Fifty-sixth Congress by which the parity of
all our money and the stability of our currency upon a gold
basis has been secured.

"We recognize that interest rates are potent factors in


production and business activity, and for the purpose of
further equalizing and of further lowering the rates of
interest, we favor such monetary legislation as will enable
the varying needs of the seasons and of all sections to be
promptly met in order that trade may be evenly sustained,
labor steadily employed, and commerce enlarged. The volume of
money in circulation was never so great per capita as it is
to-day.

"We declare our steadfast opposition to the free and unlimited


coinage of silver. No measure to that end could be considered
which was without the support of the leading commercial
countries of the world. However firmly Republican legislation
may seem to have secured the country against the peril of base
and discredited currency, the election of a Democratic
President could not fail to impair the country's credit and to
bring once more into question the intention of the American
people to maintain upon the gold standard the parity of their
money circulation. The Democratic party must be convinced that
the American people will never tolerate the Chicago platform.

"We recognize the necessity and propriety of the honest


cooperation of capital to meet new business conditions, and
especially to extend our rapidly increasing foreign trade, but
we condemn all conspiracies and combinations intended to
restrict business, to create monopolies, to limit production,
or to control prices, and favor such legislation as will
effectively restrain and prevent all such abuses, protect and
promote competition, and secure the rights of producers,
laborers, and all who are engaged in industry and commerce.

"We renew our faith in the policy of protection to American


labor. In that policy our industries have been established,
diversified, and maintained. By protecting the home market
competition has been stimulated and production cheapened.
Opportunity to the inventive genius of our people has been
secured and wages in every department of labor maintained at
high rates, higher now than ever before, and always
distinguishing our working people in their better conditions
of life from those of any competing country. Enjoying the
blessings of the American common school, secure in the right
of self-government, and protected in the occupancy of their
own markets, their constantly increasing knowledge and skill
have enabled them finally to enter the markets of the world.

"We favor the associated policy of reciprocity so directed as


to open our markets on favorable terms for what we do not
ourselves produce in return for free foreign markets.

"In the further interest of American workmen we favor a more


effective restriction of the immigration of cheap labor from
foreign lands, the extension of opportunities of education for
working children, the raising of the age limit for child
labor, the protection of free labor as against contract
convict labor, and an effective system of labor insurance.

"Our present dependence upon foreign shipping for nine-tenths


of our foreign carrying is a great loss to the industry of
this country. It is also a serious danger to our trade, for
its sudden withdrawal in the event of European war would
seriously cripple our expanding foreign commerce. The National
defence and naval efficiency of this country, moreover, supply
a compelling reason for legislation which will enable us to
recover our former place among the trade carrying fleets of
the world.

"The nation owes a debt of profound gratitude to the soldiers


and sailors who have fought its battles, and it is the
Government's duty to provide for the survivors and for the
widows and orphans of those who have fallen in the country's
wars. The pension laws, founded in this just sentiment, should
be liberal, and should be liberally administered, and
preference should be given wherever practicable with respect
to employment in the public service to soldiers and sailors
and to their widows and orphans.

"We commend the policy of the Republican party in maintaining


the efficiency of the Civil Service. The Administration has
acted wisely in its effort to secure for public service in
Cuba, Porto Rico, Hawaii and the Philippine Islands only those
whose fitness has been determined by training and experience.
We believe that employment in the public service in these
territories should be confined as far as practicable to their
inhabitants.

"It was the plain purpose of the Fifteenth Amendment to the


Constitution to prevent discrimination on account of race or
color in regulating the elective franchise. Devices of State
governments, whether by statutory or constitutional enactment
to avoid the purpose of this amendment are revolutionary and
should be condemned.

{651}

"Public movements looking to a permanent improvement of the


roads and highways of the country meet with our cordial
approval and we recommend this subject to the earnest
consideration of the people and of the Legislatures of the
several States. We favor the extension of the rural free
delivery service wherever its extension may be justified.

"In further pursuance of the constant policy of the Republican


party to provide free homes on the public domain, we recommend
adequate National legislation to reclaim the arid lands of the
United States, reserving control of the distribution of water for
irrigation to the respective States and Territories.

"We favor home rule for and the early admission to Statehood
of the Territories of New Mexico, Arizona and Oklahoma.

"The Dingley act, amended to provide sufficient revenue for


the conduct of the war, has so well performed its work that it
has been possible to reduce the war debt in the sum of
$40,000,000. So ample are the Government's revenues and so
great is the public confidence in the integrity of its
obligations that its newly funded 2 per cent bonds sell at a
premium. The country is now justified in expecting, and it
will be the policy of the Republican party to bring about, a
reduction of the war taxes.

"We favor the construction, ownership, control and protection


of an isthmian canal by the Government of the United States.

"New markets are necessary for the increasing surplus of our


farm products. Every effort should be made to open and obtain
new markets, especially in the Orient, and the Administration
is warmly to be commended for its successful effort to commit
all trading and colonizing nations to the policy of the open
door in China.

"In the interest of our expanding commerce we recommend that


Congress create a department of commerce and industries in the
charge of a secretary with a seat in the Cabinet. The United
States consular system should be reorganized under the
supervision of this new department, upon such a basis of
appointment and tenure as will render it still more
serviceable to the Nation's increasing trade. The American
Government must protect the person and property of every
citizen wherever they are wrongfully violated or placed in
peril.

"We congratulate the women of America upon their splendid


record of public service in the volunteer aid association, and
as nurses in camp and hospital during the recent campaigns of
our armies in the Eastern and Western Indies, and we
appreciate their faithful co-operation in all works of
education and industry.
"President McKinley has conducted the foreign affairs of the
United States with distinguished credit to the American
people. In releasing us from the vexatious conditions of a
European alliance for the government of Samoa his course is
especially to be commended. By securing to our undivided
control the most important island of the Samoan group and the
best harbor in the Southern Pacific, every American interest
has been safeguarded. We approve the annexation of the
Hawaiian Islands to the United States. We commend the part
taken by our Government in the Peace Conference at The Hague.
We assert our steadfast adherence to the policy announced in
the Monroe Doctrine. The provisions of The Hague Convention
were wisely regarded when President McKinley tendered his
friendly offices in the interest of peace between Great
Britain and the South African republics. While the American
Government must continue the policy prescribed by Washington,
affirmed by every succeeding President and imposed upon us by
The Hague Treaty, of non-intervention in European
controversies, the American people earnestly hope that a way
may soon be found, honorable alike to both contending parties,
to terminate the strife between them.

"In accepting by the Treaty of Paris the just responsibility


of our victories in the Spanish war the President and the
Senate won the undoubted approval of the American people. No
other course was possible than to destroy Spain's sovereignty
throughout the West Indies and in the Philippine Islands. That
course created our responsibility before the world, and with
the unorganized population whom our intervention had freed
from Spain, to provide for the maintenance of law and order,
and for the establishment of good government and for the
performance of international obligations. Our authority could
not be less than our responsibility, and wherever sovereign
rights were extended it became the high duty of the Government
to maintain its authority, to put down armed insurrection and
to confer the blessings of liberty and civilization upon all
the rescued peoples. The largest measure of self-government
consistent with their welfare and our duties shall be secured
to them by law.

"To Cuba independence and self-government were assured in the


same voice by which war was declared, and to the letter this
pledge will be performed.

"The Republican party upon its history, and upon this


declaration of its principles and policies, confidently
invokes the considerate and approving judgment of the American
people."

UNITED STATES OF AMERICA: A. D. 1900


Prohibition Party Platform and Nominations.

In the next week after the meeting of the Republican national


convention, that of the Prohibition Party was held at Chicago,
opening on the 27th of June. It chose Mr. John G. Woolley, of
Chicago (already named by the United Christian Party for Vice
President—see above) to be its candidate for President, with
Mr. Henry B. Metcalfe, of Rhode Island, for Vice President.
Setting aside all political issues save those connected with
the liquor traffic, its declarations were confined to that
subject alone, and were as follows:

"The National Prohibition party, in convention represented at


Chicago, June 27 and 28, 1900, acknowledged Almighty God as
the supreme source of all just government. Realizing that this
Republic was founded upon Christian principles, and can endure
only as it embodies justice and righteousness, and asserting
that all authority should seek the best good of all the
governed, to this end wisely prohibiting what is wrong and
permitting only what is right, hereby records and proclaims:

{652}

"First.—We accept and assert the definition given by Edward


Burke, that a party is 'a body of men joined together for the
purpose of protecting by their joint endeavor the National
interest upon some particular principle upon which they are
all agreed.'

"We declare that there is no principle now advocated, by any


other party, which could be made a fact in government with
such beneficent moral and material results as the principle of
prohibition applied to the beverage liquor traffic; that the
National interest could be promoted in no other way so surely
and widely as by its adoption and assertion through a National
policy and a cooperation therein by every State, forbidding
the manufacture, sale, exportation, importation, and
transportation of intoxicating liquors for beverage purposes;
that we stand for this as the only principle proposed by any
party anywhere for the settlement of a question greater and
graver than any other before the American people, and
involving more profoundly than any other their moral future
and financial welfare; and that all the patriotic citizenship
of this country agreed upon this principle, however much
disagreement there may be as to minor considerations and
issues, should stand together at the ballot-box from this time
forward until prohibition is the established policy of the
United States, with a party in power to enforce it and to
insure its moral and material benefits.

"We insist that such a party agreed upon this principle and
policy, having sober leadership, without any obligation for
success to the saloon vote and to those demoralizing political
combinations, can successfully cope with all other and lesser
problems of government, in legislative halls and in the
executive chair, and that it is useless for any party to make
declarations in its platform as to any questions concerning
which there may be serious differences of opinion in its own
membership and as to which, because of such differences, the
party could legislate only on a basis of mutual concessions
when coming into power.
"We submit that the Democratic and Republican parties are
alike insincere in their assumed hostility to trusts and
monopolies. They dare not and do not attack the most dangerous
of them all, the liquor power. So long as the saloon debauches
the citizen and breeds the purchasable voter, money will
continue to buy its way to power. Break down this traffic,
elevate manhood, and a sober citizenship will find a way to
control dangerous combinations of capital. We purpose, as a
first step in the financial problem of the nation, to save
more than a billion of dollars every year, now annually
expended to support the liquor traffic and to demoralize our
people. When that is accomplished, conditions will have so
improved that with a clearer atmosphere the country can
address itself to the questions as to the kind and quantity of
currency needed.

"Second.—We reaffirm as true indisputably the declaration of


William Windom, when Secretary of the Treasury in the Cabinet
of President Arthur, that 'considered socially, financially,
politically, or morally, the licensed liquor traffic is or
ought to be the overwhelming issue in American politics, and
that the destruction of this iniquity stands next on the
calendar of the world's progress.' We hold that the existence
of our party presents this issue squarely to the American
people, and lays upon them the responsibility of choice
between liquor parties, dominated by distillers and brewers,
with their policy of saloon perpetuation breeding waste,
wickedness, woe, pauperism, taxation, corruption, and crime,
and our one party of patriotic and moral principle, with a
policy which defends it from domination by corrupt bosses, and
which insures it forever against the blighting control of
saloon politics.

"We face with sorrow, shame, and fear the awful fact that this
liquor traffic has a grip on our Government, municipal, State,
and National, through the revenue system and a saloon
sovereignty, which no other party dare to dispute; a grip
which dominates the party now in power, from caucus to
Congress, from policemen to President, from the rum shop to
the White House; a grip which compels the Executive to consent
that law shall be nullified in behalf of the brewer, that the
canteen shall curse our army and spread intemperance across
the seas, and that our flag shall wave as the symbol of
partnership, at home and abroad, between this Government and
the men who defy and defile it for their unholy gain.

"Third.—We charge upon President McKinley, who was elected to


his high office by appeal to Christian sentiment and
patriotism almost unprecedented and by a combination of moral
influences never before seen in this country, that by his
conspicuous example as a wine-drinker at public banquets and
as a wine-serving host in the White House, he has done more to
encourage the liquor business, to demoralize the temperance
habits of young men, and to bring Christian practices and
requirements into disrepute than any other President this
Republic has had. "We further charge upon President McKinley
responsibility for the Army canteen, with all its dire brood
of disease, immorality, sin and death, in this country, in
Cuba, in Porto Rico and the Philippines; and we insist that by
his attitude concerning the canteen, and his apparent contempt
for the vast number of petitions and petitioners protesting
against it, he has outraged and insulted the moral sentiment
of this country in such a manner and to such a degree as calls
for its righteous uprising and his indignant and effective
rebuke. We challenge denial of the fact that our Chief
Executive, as commander in chief of the military forces of the
United States, at any time prior to or since March 2, 1899,
could have closed every Army saloon, called a canteen, by
executive order, as President Hayes in effect did before him,
and should have closed them, for the same reason that actuated
President Hayes; we assert that the act of Congress passed
March 2, 1899, forbidding the sale of liquor, 'in any post
exchange or canteen,' by any 'officer or private soldier' or
by 'any other person on any premises used for military
purposes in the United States,' was and is as explicit an act
of prohibition as the English language can frame; we declare
our solemn belief that the Attorney-General of the United
States in his interpretation of that law, and the Secretary of
War in his acceptance of that interpretation and his refusal
to enforce the law, were and are guilty of treasonable
nullification thereof, and that President McKinley, through
his assent to and indorsement of such interpretation and
refusal on the part of officials appointed by and responsible
to him, shares responsibility in their guilt; and we record
our conviction that a new and serious peril confronts our
country, in the fact that its President, at the behest of the
beer power, dare and does abrogate a law of Congress, through
subordinates removable at will by him and whose acts become
his, and thus virtually confesses that laws are to be
administered or to be nullified in the interest of a
law-defying business, by an Administration under mortgage to
such business for support.

{653}

"Fourth.-We deplore the fact that an Administration of this


Republic claiming the right and power to carry our flag across
seas, and to conquer and annex new territory, should admit its
lack of power to prohibit the American saloon on subjugated
soil, or should openly confess itself subject to liquor
sovereignty under that flag. We are humiliated, exasperated
and grieved by the evidence painfully abundant that this
Administration's policy of expansion is bearing so rapidly its
first fruits of drunkenness, insanity and crime under the
hothouse sun of the tropics; and when the president of the
first Philippine Commission says 'It was unfortunate that we
introduced and established the saloon there, to corrupt the
natives and to exhibit the vices of our race,' we charge the
inhumanity and un-Christianity of this act upon the
Administration of William McKinley and upon the party which
elected and would perpetuate the same.

"Fifth.—We declare that the only policy which the Government


of the United States can of right uphold as to the liquor
traffic under the National Constitution upon any territory
under the military or civil control of that Government is the
policy of prohibition; that 'to establish justice, insure
domestic tranquillity, provide for the common defence, promote
the general welfare, and insure the blessings of liberty to
ourselves and our posterity,' as the Constitution provides,
the liquor traffic must neither be sanctioned nor tolerated,
and that the revenue policy, which makes our Government a
partner with distillers and brewers and barkeepers, is a
disgrace to our civilization, an outrage upon humanity, and a
crime against God.

"We condemn the present Administration at Washington because


it has repealed the prohibitory law in Alaska, and has given
over the partly civilized tribes there to be the prey of the
American grogshop, and because it has entered upon a license
policy in our new possessions by incorporating the same in the
revenue act of Congress in the code of laws for the government
of the Hawaiian Islands.

"We call general attention to the fearful fact that


exportation of liquors from the United States to the
Philippine Islands increased from $337 in 1898 to $167,198 in
the first ten months of the fiscal year ended June 30, 1900;
and that while our exportations of liquor to Cuba never
reached $30,000 a year previous to American occupation of that
island, our exports of such liquors to Cuba during the fiscal
year of 1899 reached the sum of $629,655.

"Sixth.—One great religious body (the Baptist) having truly


declared of the liquor traffic 'that it has no defensible
right to exist, that it can never be reformed, that it stands
condemned by its unrighteous fruits as a thing unchristian,
un-American, and perilous utterly to every interest in life';
another great religious body (the Methodist) having as truly
asserted and reiterated that 'no political party has the right
to expect, nor should it receive, the votes of Christian men
so long as it stands committed to the license system or
refuses to put itself on record in an attitude of open
hostility to the saloons'; other great religious bodies having
made similar deliverances, in language plain and unequivocal,
as to the liquor traffic and the duty of Christian citizenship
in opposition thereto, and the fact being plain and undeniable
that the Democratic party stands for license, the saloon, and
the canteen, while the Republican party, in policy and
administration, stands for the canteen, the saloon, and
revenue therefrom, we declare ourselves justified in expecting
that Christian voters everywhere shall cease their complicity
with the liquor curse by refusing to uphold a liquor party,
and shall unite themselves with the only party which upholds
the prohibition policy, and which for nearly thirty years has
been the faithful defender of the church, the State, the home,
and the school against the saloon, its expanders and
perpetuators, their actual and persistent foes.

"We insist that no differences of belief, as to any other


question or concern of government, should stand in the way of
such a union of moral and Christian citizenship as we hereby
invite for the speedy settlement of this paramount moral,
industrial, financial, and political issue which our party
presents; and we refrain from declaring ourselves upon all
minor matters as to which differences of opinion may exist
that hereby we may offer to the American people a platform so
broad that all can stand upon it who desire to see sober
citizenship actually sovereign over the allied hosts of evil,
sin, and crime in a government of the people, by the people,
and for the people.

"We declare that there are but two real parties to-day
concerning the liquor traffic—Perpetuationists and
Prohibitionists—and that patriotism, Christianity, and every
interest of genuine republicanism and of pure democracy,
besides the loyal demands of our common humanity, require the
speedy union, in one solid phalanx at the ballot-box, of all
who oppose the liquor traffic's perpetuation, and who covet
endurance for this Republic."

UNITED STATES OF AMERICA: A. D. 1900.


Democratic Party Platform and Nominations.

The delegates of the Democratic Party met in national


convention at Kansas City, on the Fourth of July. By unanimous
vote, on the following day, they again nominated William J.
Bryan, of Nebraska, for President, and subsequently associated
with him ex-Vice President Adlai E. Stevenson, of Illinois,
for Vice President. The platform, adopted on the same day,
reiterating the demand of 1896 for a free and unlimited
coinage of silver at the ratio of 16 to 1, but emphasizing the
question of colonial expansion as the "paramount issue of the
campaign," was as follows: "'We, the representatives of the
Democratic party of the United States, assembled in national
convention on the anniversary of the adoption of the
Declaration of Independence, do reaffirm our faith in that
immortal proclamation of the inalienable rights of man, and
our allegiance to the constitution framed in harmony therewith
by the fathers of the Republic. We hold with the United States
Supreme Court that the Declaration of Independence is the spirit
of our government, of which the constitution is the form and
letter.
{654}
We declare again that all governments instituted among men
derive their just powers from the consent of the governed;
that any government not based upon the consent of the governed
is a tyranny; and that to impose upon any people a government
of force is to substitute the methods of imperialism for those
of a republic. We hold that the constitution follows the flag
and denounce the doctrine that an executive or congress,
deriving their existence and their powers from the
constitution, can exercise lawful authority beyond it, or in
violation of it. We assert that no nation can long endure half
republic and half empire, and we warn the American people that
imperialism abroad will lead quickly and inevitably to
despotism at home.

"Believing in these fundamental principles, we denounce the


Porto Rico law, enacted by a Republican Congress against the
protest and opposition of the Democratic minority, as a bold
and open violation of the Nation's organic law and a flagrant
breach of National good faith. It imposes upon the people of
Porto Rico a government without their consent, and taxation
without representation. It dishonors the American people by
repudiating a solemn pledge made in their behalf by the
commanding general of our Army, which the Porto Ricans
welcomed to a peaceful and unresisted occupation of their
land. It dooms to poverty and distress a people whose
helplessness appeals with peculiar force to our justice and
magnanimity. In this, the first act of its imperialistic
programme, the Republican party seeks to commit the United
States to a colonial policy inconsistent with republican
institutions and condemned by the Supreme Court in numerous
decisions.

"We demand the prompt and honest fulfilment of our pledge to


the Cuban people and the world, that the United States has no
disposition nor intention to exercise sovereignty,
jurisdiction, or control over the island of Cuba, except for
its pacification. The war ended nearly two years ago, profound
peace reigns over all the island, and still the Administration
keeps the government of the island from its people, while
Republican carpetbag officials plunder its revenue and exploit
the colonial theory to the disgrace of the American people.

"We condemn and denounce the Philippine policy of the present


Administration. It has embroiled the Republic in an
unnecessary war, sacrificed the lives of many of its noblest
sons, and placed the United States, previously known and
applauded throughout the world as the champion of freedom, in
the false and un-American position of crushing with military
force the efforts of our former allies to achieve liberty and
self-government. The Filipinos cannot be citizens without
endangering our civilization; they cannot be subjects without
imperilling our form of government; and as we are not willing
to surrender our civilization, or to convert the Republic into
an empire, we favor an immediate declaration of the Nation's
purpose to give to the Filipinos, first, a stable form of
government; second, independence; and third, protection from
outside interference such as has been given for nearly a
century to the republics of Central and South America. The
greedy commercialism which dictated the Philippine policy of
the Republican Administration attempts to justify it with the
plea that it will pay, but even this sordid and unworthy plea
fails when brought to the test of facts. The war of 'criminal
aggression' against the Filipinos, entailing an annual expense
of many millions, has already cost more than any possible
profit that could accrue from the entire Philippine trade for
years to come. Furthermore, when trade is extended at the
expense of liberty the price is always too high.

"We are not opposed to territorial expansion, when it takes in


desirable territory which can be erected into States in the
Union, and whose people are willing and fit to become American
citizens. We favor trade expansion by every peaceful and
legitimate means. But we are unalterably opposed to the
seizing or purchasing of distant islands to be governed
outside the Constitution and whose people can never become
citizens. We are in favor of extending the Republic's
influence among the nations, but believe that influence should
be extended not by force and violence, but through the
persuasive power of a high and honorable example.

"The importance of other questions now pending before the


American people is in nowise diminished and the Democratic
party takes no backward step from its position on them; but
the burning issue of imperialism, growing out of the Spanish
war, involving the very existence of the Republic and the
destruction of our free institutions, we regard as the
paramount issue of the campaign.

"The declaration of the Republican platform adopted at the


Philadelphia Convention, held in June, 1900, that the
Republican party 'steadfastly adheres to the policy announced
in the Monroe Doctrine,' is manifestly insincere and
deceptive. This profession is contradicted by the avowed
policy of that party, in opposition to the spirit of the
Monroe Doctrine, to acquire and hold sovereignty over large
areas of territory and large numbers of people in the Eastern
Hemisphere. We insist on the strict maintenance of the Monroe
Doctrine in all its integrity, both in letter and in spirit,
as necessary to prevent the extension of European authority on
these continents and as essential to our supremacy in American
affairs. At the same time we declare that no American people
shall ever be held by force in unwilling subjection to
European authority.

"We oppose militarism. It means conquest abroad and


intimidation and oppression at home. It means the strong arm
which has ever been fatal to free institutions. It is what
millions of our citizens have fled from in Europe. It will
impose upon our peace loving people a large standing army, an
unnecessary burden of taxation, and would be a constant menace
to their liberties. A small standing army and a well
disciplined State militia are amply sufficient in time of
peace. This Republic has no place for a vast military
establishment, a sure forerunner of compulsory military
service and conscription. When the Nation is in danger the
volunteer soldier is his country's best defender. The National
Guard of the United States should ever be cherished in the
patriotic hearts of a free people. Such organizations are ever
an element of strength and safety. For the first time in our
history and coeval with the Philippine conquest has there been
a wholesale departure from our time honored and approved
system of volunteer organization. We denounce it as
un-American, undemocratic and unrepublican and as a subversion
of the ancient and fixed principles of a free people.

{655}

"Private monopolies are indefensible and intolerable. They


destroy competition, control the price of raw material and of
the finished product, thus robbing both producer and consumer.
They lessen the employment of labor and arbitrarily fix the terms
and conditions thereof; and deprive individual energy and
small capital of their opportunity for betterment. They are
the most efficient means yet devised for appropriating the
fruits of industry to the benefit of the few at the expense of
the many, and, unless their insatiate greed is checked, all
wealth will be aggregated in a few hands and the Republic
destroyed. The dishonest paltering with the trust evil by the
Republican party in its State and National platforms is
conclusive proof of the truth of the charge that trusts are
the legitimate product of Republican policies, that they are
fostered by Republican laws, and that they are protected by
the Republican Administration in return for campaign
subscriptions and political support. We pledge the Democratic
party to an unceasing warfare in Nation, State and city
against private monopoly in every form. Existing laws against
trusts must be enforced and more stringent ones must be
enacted providing for publicity as to the affairs of
corporations engaged in interstate commerce and requiring all
corporations to show, before doing business outside of the
State of their origin, that they have no water in their stock,
and that they have not attempted and are not attempting to
monopolize any branch of business or the production of any
articles of merchandise; and the whole constitutional power of
Congress over interstate commerce, the mails and all modes of
interstate communication shall be exercised by the enactment
of comprehensive laws upon the subject of trusts.

"Tariff laws should be amended by putting the products of


trusts upon the free list, to prevent monopoly under the plea
of protection. The failure of the present Republican
Administration, with an absolute control over all the branches
of the National Government, to enact any legislation designed
to prevent or even curtail the absorbing power of trusts and
illegal combinations, or to enforce the anti-trust laws
already on the statute books, proves the insincerity of the
high sounding phrases of the Republican platform. Corporations
should be protected in all their rights and their legitimate
interests should be respected, but any attempt by corporations
to interfere with the public affairs of the people or to
control the sovereignty which creates them should be forbidden
under such penalties as will make such attempts impossible. We
condemn the Dingley tariff law as a trust breeding measure
skilfully devised to give to the few favors which they do not
deserve, and to place upon the many burdens which they should
not bear. We favor such an enlargement of the scope of the
Interstate Commerce law as will enable the Commission to
protect individuals and communities from discrimination and
the public from unjust and unfair transportation rates.

"We reaffirm and indorse the principles of the National


Democratic platform adopted at Chicago in 1896 and we
reiterate the demand of that platform for an American
financial system made by the American people for themselves,
which shall restore and maintain a bimetallic price level, and
as part of such system the immediate restoration of the free
and unlimited coinage of silver and gold at the present legal
ratio of 16 to 1, without waiting for the aid or consent of
any other nation.

"We denounce the currency bill enacted at the last session of


Congress as a step forward in the Republican policy which aims
to discredit the sovereign right of the National Government to
issue all money, whether coin or paper, and to bestow upon
National banks the power to issue and control the volume of
paper money for their own benefit. A permanent National bank
currency, secured by Government bonds, must have a permanent
debt to rest upon, and, if the bank currency is to increase
with population and business, the debt must also increase. The
Republican currency scheme is, therefore, a scheme for
fastening upon the taxpayers a perpetual and growing debt for
the benefit of the banks. We are opposed to this private
corporation paper circulated as money, but without legal
tender qualities, and demand the retirement of National bank
notes as fast as Government paper or silver certificates can
be substituted for them. We favor an amendment to the Federal
Constitution providing for the election of United States
Senators by direct vote of the people, and we favor direct
legislation wherever practicable. We are opposed to government
by injunction; we denounce the blacklist, and favor
arbitration as a means of settling disputes between
corporations and their employés.

"In the interest of American labor and the upbuilding of the


workingman as the cornerstone of the prosperity of our
country, we recommend that Congress create a Department of
Labor, in charge of a Secretary, with a seat in the Cabinet,
believing that the elevation of the American laborer will
bring with it increased production and increased prosperity to
our country at home and to our commerce abroad. We are proud
of the courage and fidelity of the American soldiers and
sailors in all our wars; we favor liberal pensions to them and
their dependents; and we reiterate the position taken in the
Chicago platform in 1896, that the fact of enlistment and
service shall be deemed conclusive evidence against disease
and disability before enlistment.

"We favor the immediate construction, ownership and control of


the Nicaraguan canal by the United States, and we denounce the

You might also like