javascript - 优化 json 中 bool 数组的大小

Question

我为类似塞尔达的游戏(RPG)编写了一个小型关卡设计器 是否有某个地方(可以行走的 16x16 方 block 是在关卡设计器保存 map 时预先计算好的) 然后将该 map 加载到游戏中。

可行走的方 block (图 block )存储在大量数组 (x,y) 中

假设这是一个很小的 ​​3x3 map ，json 看起来像这样:

walls = [[true,true, true],
         [true,false,true],
         [true,true, true]]

意味着只有中心街区可以步行(1x1不是墙== false)

现在我确实使用了 bool 值，这样我就可以优化空间，技术上我可以在 1 个字节中存储 8 个 block 信息。

但它现在的存储方式感觉非常未优化，因为每个 block 都存储为 json 文件内 bool 值的字符串表示形式。

有没有办法存储数组的原始二进制数据，或者创建我自己的协议(protocol)并将这些不规则的二进制数据存储在 json 中？

这个数组显然在生成时不会被人类解释，所以我不介意它不可读。

Answer 1

对于初学者，让我们使用整数代替:

walls = [[1,1,1],
         [1,0,1],
         [1,1,1]]

A 1 甚至看起来像一堵墙;-)

将其字符串化将为您提供比 bool 值短得多的东西:

JSON.stringify(walls) // "[[1,1,1],[1,0,1],[1,1,1]]"

您还可以自己将 map 字符串化为更紧凑的格式:

const walls = [[1,1,1],
             [1,0,1],
             [1,1,1]];

// Stringified
const map = walls.map(r => r.join('')).join('|');
console.log(map); // "111|101|111"

// Unstringified
const wallsAgain = map.split('|').map(r => r.split('').map(Number))
console.log(wallsAgain);

// Or back to your boolean format.
const wallsToBooleans = map.split('|').map(r => r.split('').map(c => c === '1'))
console.log(wallsToBooleans)

<小时/>

现在事情变得有趣了......

如果我们真的要疯了，我们可以通过将 1/0 的“二进制”表示转换为不同的基数来使字符串化映射变得更短:

const walls = [[1,1,1,1,1],
               [1,0,1,0,1],
               [1,1,1,1,1],
               [1,0,1,0,1],
               [1,1,1,1,1]];

const mapBase = 36;

const map = stringifyMap(walls);

console.log(map);                           // Stringified ("1f|15|1f|15|1f")
console.log(parseMap(map));                 // Unstringified
console.log(parseMap(map, c => c === '1')); // Or back to your boolean format.

// Walls to string
function stringifyMap(walls) {
  return walls.map(r => rowToStr(r)).join('|');
}

// String to walls
function parseMap(map, cellParser) {
  return map.split('|')
    .map(r => strToRow(r)
      .map(cellParser || Number))

}

function rowToStr(row){
  const num = parseInt(row.join(''), 2); // Parse the `'10101'` to int,
  return num.toString(mapBase);          // Then convert it to a higher base;
}

function strToRow(str){
  const num = parseInt(str, mapBase); // Parse the higher base to int,
  return num.toString(2).split('');   // Then convert it to binary.
}