diff --git a/.eleventy.js b/.eleventy.js index 73050df..9fdf6d5 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -81,11 +81,16 @@ module.exports = function(eleventyConfig) { }); eleventyConfig.setLibrary('md', md); - // asset_img shortcode - eleventyConfig.addLiquidShortcode('asset_img', (filename, alt) => { + // post_img shortcode + eleventyConfig.addLiquidShortcode('post_img', (filename, alt) => { return `${alt}` }) + // post_avif_img shortcode + eleventyConfig.addLiquidShortcode('post_avif_img', (avif_filename, fallback_filename, alt) => { + return `${alt}` + }) + eleventyConfig.addTransform("htmlmin", do_minifyhtml); return { diff --git a/README.md b/README.md index 336a469..d30a64d 100644 --- a/README.md +++ b/README.md @@ -32,7 +32,7 @@ A blog that still runs without javascript. Hence, no bundlers. + Shortcode to handle images - Add image under `src/assets/img/posts` and use the asset_img short code - - `{% asset_img 'filename' 'alt_text' %}` eg. `{% asset_img 'mailbox.jpg' 'mailbox' %}` + - `{% post_img 'filename' 'alt_text' %}` eg. `{% post_img 'mailbox.jpg' 'mailbox' %}` - Draft posts using the `published` frontmatter diff --git a/src/posts/2024/01/formatos-de-imagem-modernos-jxl-avif.md b/src/posts/2024/01/formatos-de-imagem-modernos-jxl-avif.md index 7b8b2f3..775c1da 100644 --- a/src/posts/2024/01/formatos-de-imagem-modernos-jxl-avif.md +++ b/src/posts/2024/01/formatos-de-imagem-modernos-jxl-avif.md @@ -19,7 +19,7 @@ A visualização de imagens é fundamental em vários setores, como artes plást Em uma tela de computador, uma imagem é representada por milhares de *pixels* (**pic**ture **el**ement), cada *pixel* correspondendo a uma cor e sua intensidade. Considere uma imagem de tamanho 1.024px x 768px = 786.432 *pixels*; se cada pixel for RGBA e tiver 4 *bytes*, 1 para vermelho, 1 para verde, 1 para azul e 1 para transparência, essa imagem terá um tamanho de 3,1MB, o que é bastante alto. Contudo, escolhendo técnicas de compressão e um formato de arquivo adequados, podemos ter essa imagem com a mesma qualidade e ocupando muito menos espaço em memória. -{% asset_img '2024_01_hires_images_examples.jpg' 'Exemplos de imagens de alta resolução' %} +{% post_img '2024_01_hires_images_examples.jpg' 'Exemplos de imagens de alta resolução' %} ## Novos formatos @@ -62,14 +62,11 @@ Exemplos: A imagem original abaixo é um JPG de dimensões 8192x5464, com tamanho de 11MB. Em formato JXL (q=90), o tamanho ficou em 7,3MB. Em AVIF (q=90), ficou em 8,3MB. -{% asset_img '2024_01_subway_escalators.jpg' 'Escadas-rolantes de uma estação de metrô' %} +{% post_img '2024_01_subway_escalators.jpg' 'Escadas-rolantes de uma estação de metrô' %} O GIF original abaixo tem tamanho de 3,1MB. Em formato JXL (q=90), o tamanho ficou em 2,5MB. Em AVIF (q=90), ficou em 79kB. Impressionante! - - - Emilia Clarke - +{% post_avif_img '2024_01_emilia_clarke.avif' '2024_01_emilia_clarke.gif' 'Emilia Clarke' %} Este repositório no GitHub ([link](https://github.com/alexandrehtrb/jxl-avif-simple-benchmark)) executa testes para comparar as velocidades e taxas de compressão do JXL e do AVIF. A comparação não é qualitativa, nem científica. Como imagens de entrada, estão: @@ -136,10 +133,7 @@ Se você quer usar esses novos formatos, mas quer garantir compatibilidade com n Se o navegador tiver suporte, tentará primeiro carregar a imagem em formato AVIF; senão, carregará a imagem em formato GIF. A animação abaixo está dentro de uma tag `` - você pode conferir o formato ao salvar o arquivo. - - - Cortinas balançando com o vento - +{% post_avif_img '2024_01_curtains.avif' '2024_01_curtains.gif' 'Cortinas balançando com o vento' %} Devido ao tamanho menor das imagens, as páginas carregam mais rápido. diff --git a/src/posts/2024/01/links-simbolicos-em-multi-repos.md b/src/posts/2024/01/links-simbolicos-em-multi-repos.md index ec41b14..72483dc 100644 --- a/src/posts/2024/01/links-simbolicos-em-multi-repos.md +++ b/src/posts/2024/01/links-simbolicos-em-multi-repos.md @@ -129,7 +129,7 @@ C:\MeusProjetos\ No VS Code, *symlinks* têm uma setinha ao lado direito do nome do arquivo. -{% asset_img '2024_01_vscode_symlinks.png' 'Symlinks no VS Code' %} +{% post_img '2024_01_vscode_symlinks.png' 'Symlinks no VS Code' %} O comando para criar links simbólicos no Linux e no Mac OSX é: @@ -157,11 +157,11 @@ O Git suporta ter arquivos *symlink* commitados nos repositórios. No GitHub, eles aparecem com uma setinha e nome em azul. -{% asset_img '2024_01_github_symlink_repo.png' 'Symlinks repo' %} +{% post_img '2024_01_github_symlink_repo.png' 'Symlinks repo' %} Na navegação online e em pull requests, o conteúdo do arquivo aparece como um texto do caminho, absoluto ou relativo. -{% asset_img '2024_01_github_symlink_file.png' 'Symlinks repo file' %} +{% post_img '2024_01_github_symlink_file.png' 'Symlinks repo file' %} ## Quando devo usar essa abordagem? @@ -177,7 +177,7 @@ Diretórios simbólicos podem ser uma boa alternativa a submódulos do Git. 1) Se você estiver usando Windows, é necessário habilitar links simbólicos durante a instalação do Git: -{% asset_img '2024_01_git_windows_setup_symlinks.png' 'Git for Windows setup Symlinks' %} +{% post_img '2024_01_git_windows_setup_symlinks.png' 'Git for Windows setup Symlinks' %} 2) Alguns sistemas de arquivos não suportam links simbólicos, por exemplo, FAT32 e exFAT. Esses sistemas de arquivos são comuns em pen-drives e cartões SD. diff --git a/src/posts/2024/01/modern-image-formats-jxl-and-avif.md b/src/posts/2024/01/modern-image-formats-jxl-and-avif.md index 70eca85..67f3873 100644 --- a/src/posts/2024/01/modern-image-formats-jxl-and-avif.md +++ b/src/posts/2024/01/modern-image-formats-jxl-and-avif.md @@ -19,7 +19,7 @@ The visualization of images is fundamental in many areas, such as arts, professi On a computer screen, an image is represented by thousands of *pixels* (**pic**ture **el**ement), each *pixel* corresponding to a colour and its intensity. Consider an image of 1,024px x 768px = 768,432 *pixels*; if each pixel is RGBA and has 4 *bytes*, 1 for red, 1 for green, 1 for blue and 1 for transparency, this image will have a size of 3.1MB, which is quite large. However, by choosing proper compression techniques and file formats, we can have this image with the same quality and with a much lower file size. -{% asset_img '2024_01_hires_images_examples.jpg' 'Examples of high-resolution images' %} +{% post_img '2024_01_hires_images_examples.jpg' 'Examples of high-resolution images' %} ## Newer formats @@ -62,14 +62,11 @@ Examples: The original image below is a JPEG of 8192x5464, file size 11MB. In JXL format (q=90), the size is 7.3MB. In AVIF (q=90), is 8.3MB. -{% asset_img '2024_01_subway_escalators.jpg' 'Escalators in a subway station' %} +{% post_img '2024_01_subway_escalators.jpg' 'Escalators in a subway station' %} The original GIF below has a file size of 3.1MB. In JXL format (q=90), the size is 2.5MB. In AVIF (q=90), is 79kB. Impressive! - - - Emilia Clarke - +{% post_avif_img '2024_01_emilia_clarke.avif' '2024_01_emilia_clarke.gif' 'Emilia Clarke' %} This [GitHub repo](https://github.com/alexandrehtrb/jxl-avif-simple-benchmark) executes tests to compare compression rates and speeds of JXL and AVIF. The comparison is not qualitative, nor scientific. The input images include: @@ -136,10 +133,7 @@ If you want to use these new formats, but also want to guarantee compatibility w If the browser supports, it will first try to load the picture in AVIF format; else, a GIF will be loaded. The animation below is inside a `` tag - you can verify which format is it by saving the picture. - - - Curtains moving with the wind - +{% post_avif_img '2024_01_curtains.avif' '2024_01_curtains.gif' 'Curtains moving with the wind' %} Due to the reduced file size of the images, the web pages will load faster. diff --git a/src/posts/2024/01/symlinks-for-multi-repos.md b/src/posts/2024/01/symlinks-for-multi-repos.md index 63aec8e..3900531 100644 --- a/src/posts/2024/01/symlinks-for-multi-repos.md +++ b/src/posts/2024/01/symlinks-for-multi-repos.md @@ -129,7 +129,7 @@ C:\MyProjects\ On VS Code, symlinks have an arrow icon to the right of the file name. -{% asset_img '2024_01_vscode_symlinks.png' 'Symlinks on VS Code' %} +{% post_img '2024_01_vscode_symlinks.png' 'Symlinks on VS Code' %} The command to create symlinks on Linux and Mac OSX is: @@ -157,11 +157,11 @@ Git supports symlink files committed in repositories. On GitHub, they appear with an arrow and name coloured in blue. -{% asset_img '2024_01_github_symlink_repo.png' 'Symlinks repo' %} +{% post_img '2024_01_github_symlink_repo.png' 'Symlinks repo' %} On online navigation and in pull requests, the file content appears as the symlink's path, either absolute or relative. -{% asset_img '2024_01_github_symlink_file.png' 'Symlinks repo file' %} +{% post_img '2024_01_github_symlink_file.png' 'Symlinks repo file' %} ## When should I use this approach? @@ -177,7 +177,7 @@ Symbolic directories can be a good alternative to Git submodules, in some cases. 1) If you are using Windows, you need to enable symbolic links during the Git installation: -{% asset_img '2024_01_git_windows_setup_symlinks.png' 'Git for Windows setup Symlinks' %} +{% post_img '2024_01_git_windows_setup_symlinks.png' 'Git for Windows setup Symlinks' %} 2) Some file systems do not support symlinks, such as FAT32 and exFAT. These two are commonly found in pen-drives and SD cards. diff --git a/src/posts/2024/03/http2-and-http3-explained.md b/src/posts/2024/03/http2-and-http3-explained.md index 8cb6c4d..a395ffe 100644 --- a/src/posts/2024/03/http2-and-http3-explained.md +++ b/src/posts/2024/03/http2-and-http3-explained.md @@ -23,7 +23,7 @@ In the beginning of the 1990s, Tim Berners-Lee and his team at [CERN](https://ho HTTP reused for data transport the existing TCP/IP protocols, with HTTP message bytes residing in the [application layer](https://en.wikipedia.org/wiki/Application_layer), light blue in the image below. -{% asset_img '2024_03_osi_model_tcp_ip.png' 'OSI model' %} +{% post_img '2024_03_osi_model_tcp_ip.png' 'OSI model' %} ## HTTP/0.9 @@ -103,7 +103,7 @@ Expires: 0 {"name":"Orange","id":2,"family":"Rutaceae","order":"Sapindales","genus":"Citrus","nutritions":{"calories":43,"fat":0.2,"sugar":8.2,"carbohydrates":8.3,"protein":1.0}} ``` -{% asset_img '2024_03_http1_tcp_packets.png' 'HTTP1 in TCP packets' %} +{% post_img '2024_03_http1_tcp_packets.png' 'HTTP1 in TCP packets' %} ## HTTP/2 @@ -140,7 +140,7 @@ sequenceDiagram The image below shows how frames go inside a TCP packet. Stream 1 carries a HTTP response for a JavaScript file and stream 2 carries a HTTP response for a CSS file. -{% asset_img '2024_03_http2_tcp_packets.png' 'HTTP2 frames in TCP packets' %} +{% post_img '2024_03_http2_tcp_packets.png' 'HTTP2 frames in TCP packets' %} ## HTTP/3 @@ -191,7 +191,7 @@ sequenceDiagram end ``` -{% asset_img '2024_03_http3_quic_packets.png' 'HTTP3 QUIC packets' %} +{% post_img '2024_03_http3_quic_packets.png' 'HTTP3 QUIC packets' %} The head-of-line blocking related to TLS (SSL) happens on TCP because the cryptography is usually applied over the entire message content, meaning that all data (all packets) needs to be received for the decryption to happen. With QUIC, the cryptography is individual for each QUIC packet, that is decrypted on arrival, without having to receive all packets beforehand. diff --git a/src/posts/2024/03/http2-e-http3-explicados.md b/src/posts/2024/03/http2-e-http3-explicados.md index 1923fcf..a05c020 100644 --- a/src/posts/2024/03/http2-e-http3-explicados.md +++ b/src/posts/2024/03/http2-e-http3-explicados.md @@ -23,7 +23,7 @@ No início da década de 1990, Tim Berners-Lee e sua equipe no [CERN](https://ho O HTTP, em questão, aproveitou os protocolos TCP/IP já existentes como meio de transporte de dados. Os bytes de uma mensagem HTTP ficam na [camada de aplicação](https://pt.wikipedia.org/wiki/Camada_de_aplica%C3%A7%C3%A3o), em azul claro na imagem abaixo. -{% asset_img '2024_03_osi_model_tcp_ip.png' 'Modelo OSI' %} +{% post_img '2024_03_osi_model_tcp_ip.png' 'Modelo OSI' %} ## HTTP/0.9 @@ -103,7 +103,7 @@ Expires: 0 {"name":"Orange","id":2,"family":"Rutaceae","order":"Sapindales","genus":"Citrus","nutritions":{"calories":43,"fat":0.2,"sugar":8.2,"carbohydrates":8.3,"protein":1.0}} ``` -{% asset_img '2024_03_http1_tcp_packets.png' 'HTTP1 em pacotes TCP' %} +{% post_img '2024_03_http1_tcp_packets.png' 'HTTP1 em pacotes TCP' %} ## HTTP/2 @@ -140,7 +140,7 @@ sequenceDiagram A imagem abaixo mostra como os *frames* entram em pacotes TCP. O *stream* 1 representa uma resposta HTTP de um arquivo JavaScript e o *stream* 2 representa uma resposta HTTP de um arquivo CSS, transmitidos via HTTP/2. -{% asset_img '2024_03_http2_tcp_packets.png' 'Frames HTTP2 em pacotes TCP' %} +{% post_img '2024_03_http2_tcp_packets.png' 'Frames HTTP2 em pacotes TCP' %} ## HTTP/3 @@ -191,7 +191,7 @@ sequenceDiagram end ``` -{% asset_img '2024_03_http3_quic_packets.png' 'Pacotes QUIC HTTP3' %} +{% post_img '2024_03_http3_quic_packets.png' 'Pacotes QUIC HTTP3' %} O bloqueio de cabeça de fila relacionado ao TLS (criptografia SSL) ocorre no TCP porque a criptografia é geralmente aplicada sobre a mensagem inteira, de modo que todos os seus pacotes precisam chegar ao destino para então ocorrer a decriptação. No caso do QUIC, a criptografia é individual para cada pacote QUIC, que é decriptado na chegada, sem haver a necessidade de receber todos os pacotes primeiro. diff --git a/src/posts/2024/04/pipelines-for-dotnet.md b/src/posts/2024/04/pipelines-for-dotnet.md index 786c219..9ac9446 100644 --- a/src/posts/2024/04/pipelines-for-dotnet.md +++ b/src/posts/2024/04/pipelines-for-dotnet.md @@ -18,10 +18,7 @@ Pipelines are sequences of commands that are executed to ensure the integrity of Having a pipeline means having a consistent process that mitigates the risk of human errors in the final product and saves the programmer's time, because he/she can take care of other tasks while the code is compiled, verified and packed. - - - Conveyor belt - +{% post_avif_img '2024_04_conveyor_belt.avif' '2024_04_conveyor_belt.jpg' 'Conveyor belt' %} ## Steps diff --git a/src/posts/2024/04/pipelines-para-dotnet.md b/src/posts/2024/04/pipelines-para-dotnet.md index 462068b..8f27a3f 100644 --- a/src/posts/2024/04/pipelines-para-dotnet.md +++ b/src/posts/2024/04/pipelines-para-dotnet.md @@ -18,10 +18,7 @@ As esteiras automatizadas, também conhecidas como *pipelines*, são seqüência Ter uma *pipeline* significa ter um processo consistente que minimiza o risco de erros humanos no produto final e economiza tempo do programador, pois ele pode se ocupar de outras tarefas enquanto o código é compilado, verificado e empacotado. - - - Esteira de produção - +{% post_avif_img '2024_04_conveyor_belt.avif' '2024_04_conveyor_belt.jpg' 'Esteira de produção' %} ## Etapas diff --git a/src/posts/2024/06/arquitetura-assincrona-sem-filas.md b/src/posts/2024/06/arquitetura-assincrona-sem-filas.md index 27587a4..306e308 100644 --- a/src/posts/2024/06/arquitetura-assincrona-sem-filas.md +++ b/src/posts/2024/06/arquitetura-assincrona-sem-filas.md @@ -13,7 +13,7 @@ tags: - dotnet --- -{% asset_img '2024_06_fila_ingressos_paul_mccartney.jpg' 'Fila de pessoas para comprar ingresso para show do Paul McCartney' %} +{% post_img '2024_06_fila_ingressos_paul_mccartney.jpg' 'Fila de pessoas para comprar ingresso para show do Paul McCartney' %} ## Arquitetura assíncrona diff --git a/src/posts/2024/06/asynchronous-architecture-without-queues.md b/src/posts/2024/06/asynchronous-architecture-without-queues.md index 39303e3..1c128e0 100644 --- a/src/posts/2024/06/asynchronous-architecture-without-queues.md +++ b/src/posts/2024/06/asynchronous-architecture-without-queues.md @@ -13,7 +13,7 @@ tags: - dotnet --- -{% asset_img '2024_06_fila_ingressos_paul_mccartney.jpg' 'People in a queue to buy tickets for Paul McCartney concert' %} +{% post_img '2024_06_fila_ingressos_paul_mccartney.jpg' 'People in a queue to buy tickets for Paul McCartney concert' %} ## Asynchronous architecture diff --git a/src/posts/2024/06/introducao-a-programacao-funcional.md b/src/posts/2024/06/introducao-a-programacao-funcional.md index 50baabb..7400476 100644 --- a/src/posts/2024/06/introducao-a-programacao-funcional.md +++ b/src/posts/2024/06/introducao-a-programacao-funcional.md @@ -11,10 +11,7 @@ tags: - dotnet --- - - - Le Chiffre, 007 Casino Royale - +{% post_avif_img '2024_06_cassino_royale_le_chiffre.avif' '2024_06_cassino_royale_le_chiffre.jpg' 'Le Chiffre, 007 Casino Royale' %} ## Paradigmas diff --git a/src/posts/2024/06/introduction-to-functional-programming.md b/src/posts/2024/06/introduction-to-functional-programming.md index b299323..32306e1 100644 --- a/src/posts/2024/06/introduction-to-functional-programming.md +++ b/src/posts/2024/06/introduction-to-functional-programming.md @@ -11,10 +11,7 @@ tags: - dotnet --- - - - Le Chiffre, 007 Casino Royale - +{% post_avif_img '2024_06_cassino_royale_le_chiffre.avif' '2024_06_cassino_royale_le_chiffre.jpg' 'Le Chiffre, 007 Casino Royale' %} ## Paradigms diff --git a/src/posts/2024/08/collation-and-encoding-in-databases.md b/src/posts/2024/08/collation-and-encoding-in-databases.md index bb990e4..20685ce 100644 --- a/src/posts/2024/08/collation-and-encoding-in-databases.md +++ b/src/posts/2024/08/collation-and-encoding-in-databases.md @@ -21,7 +21,7 @@ But what about texts? A text is a sequence of characters, a character being a le The table below is for Windows-1252 encoding, which addresses 255 possible characters, each represented by one byte. You can see this table on Windows Character Map (Win+R, `charmap`). -{% asset_img '2024_08_windows_1252_table.gif' 'Windows-1252 encoding table' %} +{% post_img '2024_08_windows_1252_table.gif' 'Windows-1252 encoding table' %} The **collation** is the ordering and comparison rule for texts. It also determines which encoding is used. diff --git a/src/posts/2024/08/collation-e-encoding-em-bancos-de-dados.md b/src/posts/2024/08/collation-e-encoding-em-bancos-de-dados.md index 086a7c0..4e99afe 100644 --- a/src/posts/2024/08/collation-e-encoding-em-bancos-de-dados.md +++ b/src/posts/2024/08/collation-e-encoding-em-bancos-de-dados.md @@ -21,7 +21,7 @@ Mas e os textos? Um texto é uma seqüência de caractéres, um caractér sendo A tabela abaixo é do encoding Windows-1252, que contempla 255 caractéres possíveis, cada um representado por um *byte*. Você pode ver essa tabela com o Mapa de Caractéres do Windows (Win+R, `charmap`). -{% asset_img '2024_08_windows_1252_table.gif' 'Tabela do encoding Windows-1252' %} +{% post_img '2024_08_windows_1252_table.gif' 'Tabela do encoding Windows-1252' %} A **collation**, por sua vez, é a regra de ordenação usada para comparar textos. Ela também determina, junto consigo, qual é o encoding utilizado. diff --git a/src/posts/2024/08/iceberg-sql.md b/src/posts/2024/08/iceberg-sql.md index 4138d9b..df45f5e 100644 --- a/src/posts/2024/08/iceberg-sql.md +++ b/src/posts/2024/08/iceberg-sql.md @@ -26,7 +26,7 @@ Os exemplos aqui são em Microsoft SQL Server, porém, a maioria deles existe de
-{% asset_img '2024_08_sql_iceberg.jpg' 'Iceberg de comandos SQL' %} +{% post_img '2024_08_sql_iceberg.jpg' 'Iceberg de comandos SQL' %}
@@ -191,10 +191,7 @@ Entrelaça duas ou mais tabelas com base em colunas de referência; esse entrela Aqui vamos focar apenas no INNER JOIN e no LEFT JOIN. - - - Diferentes tipos de JOINs no SQL - +{% post_avif_img '2024_08_sql_joins.avif' '2024_08_sql_joins.png' 'Diferentes tipos de JOINs no SQL' %} ### INNER JOIN @@ -444,10 +441,7 @@ ORDER BY s.[Id] ASC, c.[Id] ASC ## PIVOT - - - Ross pedindo para girar o sofá - Friends - +{% post_avif_img '2024_08_friends_pivot.avif' '2024_08_friends_pivot.jpg' 'Ross pedindo para girar o sofá - Friends' %} A instrução PIVOT é muito interessante. Ela transforma linhas em colunas, ou seja, rotaciona em 90º uma parte da tabela. Ela é muito boa para cruzar duas ou mais colunas de uma mesma tabela. @@ -1095,13 +1089,13 @@ No SSMS, basta habilitar a opção *Incluir plano de execução* no menu superio Ao analisar o custo de cada etapa, você pode entender quais são os gargalos de performance e a partir daí implementar melhorias, tais como criar índices, refazer os critérios de WHERE e JOIN nas consultas, entre outras. -{% asset_img '2024_08_sql_execution_plan.jpg' 'Plano de execução SQL' %} +{% post_img '2024_08_sql_execution_plan.jpg' 'Plano de execução SQL' %}
# Conclusões finais -{% asset_img '2024_08_titanic.jpg' 'Jack e Rose no Titanic' %} +{% post_img '2024_08_titanic.jpg' 'Jack e Rose no Titanic' %} O SQL é uma ferramenta extremamente poderosa e completa, e adquiriu novas capacidades ao longo dos anos. Não é à toa que é o *mainstream* de banco de dados até hoje - ele é a base de desenvolvimento de sistemas complexos. diff --git a/src/posts/2024/08/sql-iceberg.md b/src/posts/2024/08/sql-iceberg.md index 7b9c504..6ac370f 100644 --- a/src/posts/2024/08/sql-iceberg.md +++ b/src/posts/2024/08/sql-iceberg.md @@ -25,7 +25,7 @@ This article is a SQL cheatsheet, covering some of the most common commands to t The examples here are for Microsoft SQL Server, but most of them apply in a similar or equal way for other databases, such as PostgreSQL, MySQL and Oracle.
-{% asset_img '2024_08_sql_iceberg.jpg' 'SQL iceberg' %} +{% post_img '2024_08_sql_iceberg.jpg' 'SQL iceberg' %}
@@ -190,10 +190,7 @@ Interlaces two or more tables by reference columns; this interlacing can be used Here we'll focus only on INNER JOIN and LEFT JOIN. - - - Different types of JOINs on SQL - +{% post_avif_img '2024_08_sql_joins.avif' '2024_08_sql_joins.png' 'Different types of JOINs on SQL' %} ### INNER JOIN @@ -443,10 +440,7 @@ ORDER BY i.[Id] ASC, t.[Id] ASC ## PIVOT - - - Ross asking to rotate the couch - Friends - +{% post_avif_img '2024_08_friends_pivot.avif' '2024_08_friends_pivot.jpg' 'Ross asking to rotate the couch - Friends' %} The PIVOT instruction is very interesting. It transforms lines into columns, by rotating part of the table in 90º. It is very good for crossing two or more columns of a table. @@ -1093,13 +1087,13 @@ On SSMS, enabling the *Include execution plan* on the top menu will include the By analyzing the cost of each step, you can understand which performance bottlenecks exist and from there improve your query, by creating indexes, rewriting WHERE and JOIN criteria, and others. -{% asset_img '2024_08_sql_execution_plan.jpg' 'SQL execution plan' %} +{% post_img '2024_08_sql_execution_plan.jpg' 'SQL execution plan' %}
# Final conclusions -{% asset_img '2024_08_titanic.jpg' 'Jack and Rose on the Titanic' %} +{% post_img '2024_08_titanic.jpg' 'Jack and Rose on the Titanic' %} SQL is an extremely powerful and complete tool, and acquired new capabilities over the years. It is no wonder that remains being the mainstream for databases up to today; it is the basis for complex systems.