Merge pr/hoijui/3213-1 into unstable

Ref: Improve links & table in 'Getting Started' section of docs #3213

documentation/css/style.css

@@ -883,6 +883,12 @@ pre code {
 	margin: 0.25em;
 }
 
+table {
+	display: block;
+	max-width: 100%;
+	overflow-x: auto;
+}
+
 #open-navigation {
 	display: none;
 	position: fixed;

documentation/md/getting-started.md

@@ -4,7 +4,7 @@ This section will familiarise you with the basic steps necessary to start using
 
 ## Including Cytoscape.js
 
-If you are using a simple HTML environment (without a build system), then source Cytoscape.js in a `<script>` tag or [`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) it as an ES6 module, e.g.:
+If you are using a simple HTML environment (without a build system), then source Cytoscape.js in a `<script>` tag or [`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) it as an [ES6] module, e.g.:
 
 ```html
 <script src="cytoscape.min.js"></script>
@@ -16,21 +16,24 @@ import cytoscape from "./cytoscape.esm.min.js";
 </script>
 ```
 
-To use Cytoscape.js from a CDN, use one of the following CDNs:
+To use Cytoscape.js from a Content Delivery Network ([CDN]),
+use one of the following [CDN]s:
 
 - [CDNJS](https://cdnjs.com/libraries/cytoscape)
 - [jsDelivr](https://www.jsdelivr.com/package/npm/cytoscape?path=dist)
 - [Unpkg](https://unpkg.com/cytoscape/dist/)
 
 Please do not hotlink to copies of Cytoscape.js from the documentation --- they're just for the demos.
 
-The available files are available under [`cytoscape/dist/`](https://github.com/cytoscape/cytoscape.js/tree/master/dist) in the npm package:
+The available files are available under [`cytoscape/dist/`](https://github.com/cytoscape/cytoscape.js/tree/master/dist) in the `npm` package:
 
-- `cytoscape.min.js` : A minified UMD build with all dependencies included in the bundle.  This file is useful for small pages, supplementary material for an academic paper for example.
-- `cytoscape.umd.js` : A non-minified UMD build with all dependencies included in the bundle.  This file is useful for debugging on small pages, supplementary material for an academic paper for example.
-- `cytoscape.esm.min.js` : A minified ESM (`import` / `export`) build with all dependencies included in the bundle.  This file serves the same purpose as the above, but it can be imported as an ES6 module without the need for a bundler.
-- `cytoscape.cjs.js` : A non-minified CJS (Node.js) build without any bundled dependencies.  This is intended to be consumed automatically by Node.js or a bundler like Webpack via `require('cytoscape')`.
-- `cytoscape.esm.js` : A non-minified ESM (`import` / `export`) build without any bundled dependencies.  This is intended to be consumed automatically by Node.js or a bundler like Webpack via `import cytoscape from 'cytoscape'`.
+| Build File | Minified | JS Module System | Dependencies Included | Description |
+| --- | --- | --- | --- | --- |
+| `cytoscape.min.js` | yes | [UMD] (Universal Module Definition) | all | Useful for small pages, supplementary material for an academic paper for example. |
+| `cytoscape.umd.js` | no | [UMD] | all |  Useful for debugging on small pages, supplementary material for an academic paper for example. |
+| `cytoscape.esm.min.js` | yes | [ESM] (ECMAScript, uses `import` / `export`) | all | Serves the same purpose as the above, but it can be imported as an [ES6] module without the need for a bundler. |
+| `cytoscape.cjs.js` | no | [CJS] (CommonJS, used by [Node.js]) | none | Intended to be consumed automatically by [Node.js] or a bundler like [Webpack] via `require('cytoscape')`. |
+| `cytoscape.esm.js` | no | [ESM] (`import` / `export`) | none | Intended to be consumed automatically by [Node.js] or a bundler like [Webpack] via `import cytoscape from 'cytoscape'`. |
 
 <span class="important-indicator"></span> Note that Cytoscape.js uses the dimensions of your HTML DOM element container for layouts and rendering at initialisation.  Thus, it is very important to place your CSS stylesheets in the `<head>` before any Cytoscape.js-related code.  Otherwise, dimensions may be sporadically reported incorrectly, resulting in undesired behaviour.
 
@@ -50,7 +53,7 @@ To install Cytoscape.js via npm:
 npm install cytoscape
 ```
 
-To use Cytoscape.js in an ESM environment with npm (e.g. Webpack or Node.js with the [`esm`](https://www.npmjs.com/package/esm) package):
+To use Cytoscape.js in an [ESM] environment with npm (e.g. [Webpack] or [Node.js] with the [`esm`](https://www.npmjs.com/package/esm) package):
 
 ```js
 import cytoscape from 'cytoscape';
@@ -62,7 +65,7 @@ To use Cytoscape.js in a CommonJS environment like Node.js:
 var cytoscape = require('cytoscape');
 ```
 
-To use Cytoscape.js with AMD/Require.js:
+To use Cytoscape.js with [AMD]/[Require.js]:
 
 ```js
 require(['cytoscape'], function(cytoscape){
@@ -82,7 +85,7 @@ To install Cytoscape.js via Meteor/Atmosphere:
 npm install cytoscape
 ```
 
-Cytoscape.js supports environments with ES5 or newer, as it is transpiled by Babel and it uses only basic features of the standard library.  Feature detection is used for optional features that improve performance.  However, a future version of Cytoscape.js may require a more up-to-date version of the standard library.  You may want to use [`babel-polyfill`](https://babeljs.io/docs/usage/polyfill/) or [`core-js`](https://github.com/zloirock/core-js) if you want to support old browsers in future.
+Cytoscape.js supports environments with ES5 (a version of [ESM]) or newer, as it is transpiled by Babel and it uses only basic features of the standard library.  Feature detection is used for optional features that improve performance.  However, a future version of Cytoscape.js may require a more up-to-date version of the standard library.  You may want to use [`babel-polyfill`](https://babeljs.io/docs/usage/polyfill/) or [`core-js`](https://github.com/zloirock/core-js) if you want to support old browsers in future.
 
 
 
@@ -104,7 +107,7 @@ var cy = cytoscape({
 });
 ```
 
-If you are running Cytoscape.js in Node.js or otherwise running it headlessly, you will not specify the `container` option.  In implicitly headless environments like Node.js, an instance is automatically headless.  To explicitly run a headless instance (e.g. in the browser) you can specify `options.headless` as `true`.
+If you are running Cytoscape.js in [Node.js] or otherwise running it headlessly, you will not specify the `container` option.  In implicitly headless environments like [Node.js], an instance is automatically headless.  To explicitly run a headless instance (e.g. in the browser) you can specify `options.headless` as `true`.
 
 
 
@@ -165,3 +168,13 @@ var cy = cytoscape({
 Now that you have a core (graph) instance with basic options, explore the [core API](#core).  It's your entry point to all the features in Cytoscape.js.
 
 If you have code questions about Cytoscape.js, please feel free to [post your question to Stackoverflow](http://stackoverflow.com/questions/ask?tags=cytoscape.js).
+
+[CDN]: https://en.wikipedia.org/wiki/Content_delivery_network
+[UMD]: https://github.com/umdjs/umd
+[ESM]: https://nodejs.org/api/esm.html#introduction
+[ES6]: https://www.w3schools.com/js/js_es6.asp
+[CJS]: https://nodejs.org/api/modules.html#modules-commonjs-modules
+[AMD]: https://en.wikipedia.org/wiki/Asynchronous_module_definition
+[Node.js]: https://en.wikipedia.org/wiki/Node.js
+[Webpack]: https://webpack.js.org/
+[Require.js]: https://requirejs.org/