今天给大家分享一个使用匿名结构体，提升Go编程效率的小技巧，属于在日常写代码过程中积累下来的一个提升自己效率的小经验。

这个技巧之所以提效率主要体现在两方面：

• 减少一些不会复用的类型定义


• 节省纠结该给类型起什么名字的时间

尤其第二项，通过匿名结构体这个名字就能体现出来，它本身没有类型名，这能节省不少想名字的时间。再一个也能减少起错名字给其他人带来的误解，毕竟并不是所有人编程时都会按照英文的词法做命名的。

下面我先从普通结构体说起，带大家看看什么情形下用匿名结构体会带来编码效率的提升。

具名结构体

具名结构体就是平时用的普通结构体。

结构体大家都知道，用于把一组字段组织在一起，来在Go语言里抽象表达现实世界的事物，类似“蓝图”一样。

比如说定义一个名字为Car的结构体在程序里表示“小汽车”

// 定义结构体类型'car'

type car struct {

    make    string

    model   string

    mileage int

}

用到这个结构体的地方通过其名字引用其即可，比如创建上面定义的结构体的实例

// 创建car 的实例

newCar := car{

    make:    "Ford",

    model:   "taurus",

    mileage: 200000,

}

匿名结构体

匿名结构体顾名思义就是没有名字的结构体，通常只用于在代码中仅使用一次的结构类型，比如

func showMyCar() {

    newCar := struct {

        make    string

        model   string

        mileage int

    }{

        make:    "Ford",

        model:   "Taurus",

        mileage: 200000,

    }

    fmt.Printlb(newCar.mode)

}

上面这个函数中声明的匿名结构体赋值给了函数中的变量，所以只能在函数中使用。

如果一个结构体初始化后只被使用一次，那么使用匿名结构体就会很方便，不用在程序的package中定义太多的结构体类型，比如在解析接口的响应到结构体后，就可以使用匿名结构体

用于解析接口响应

func createCarHandler(w http.ResponseWriter, req *http.Request) {

    defer req.Body.Close()

    decoder := json.NewDecoder(req.Body)

    newCar := struct {

        Make    string `json:"make"`

        Model   string `json:"model"`

        Mileage int    `json:"mileage"`

    }{}

    err := decoder.Decode(&newCar)

    if err != nil {

        log.Println(err)

        return

    }

    ......

    return

}

类似上面这种代码一般在控制层写，可以通过匿名结构体实例解析到请求后再去创建对应的DTO或者领域对象供服务层或者领域层使用。

有人会问为什么不直接把API的响应解析到DTO对象里，这里说一下，匿名结构体的使用场景是在觉得定一个Struct 不值得、不方便的情况下才用的。 比如程序拿到接口响应后需要按业务规则加工下才能创建DTO实例这种情况，就很适合用匿名结构体先解析响应。

比用map更健壮

这里再说一点使用匿名结构体的好处。

使用匿名解析接口响应要比把响应解析到map[string]interface{}类型的变量里要好很多，json数据解析到匿名结构体的时候在解析的过程中会进行类型检查，会更安全。使用的时候直接通过s.FieldName访问字段也比map访问起来更方便和直观。

用于定义项目约定的公共字段

除了上面这种结构体初始化后只使用一次的情况，在项目中定义各个接口的返回或者是DTO时，有的公共字段使用匿名结构体声明类型也很方便。

一般在启动项目的时候我们都会约定项目提供的接口的响应值结构，比如响应里必须包含Code、Msg、Data三个字段，每个接口会再细分定义返回的Data的结构，这个时候用匿名结构题能节省一部分编码效率。

比如下面这个Reponse的结构体类型的定义

type UserCouponResponse struct {

 Code int64  `json:"code"`

 Msg  string `json:"message"`

 Data []*struct {

  CouponId           int    `json:"couponId"`

  ProdCode           string `json:"prodCode"`

  UserId             int64  `json:"userId"`

  CouponStatus       int    `json:"couponStatus"`

  DiscountPercentage int    `json:"discount"`

 } `json:"data"`

}

就省的先去定义一个UserCoupon类型

type UserCoupon struct {

    CouponId           int    `json:"couponId"`

    ProdCode           string `json:"prodCode"`

    UserId             int64  `json:"userId"`

    CouponStatus       int    `json:"couponStatus"`

    DiscountPercentage int    `json:"discount"`

} 

再在Response声明里使用定义的UserCoupon了

type UserCouponResponse struct {

    Code int64  `json:"code"`

    Msg  string `json:"message"`

    Data []*UserCoupon `json:"data"`

}

当然如果UserCoupon是你的项目其他地方也会用到的类型，那么先声明，顺带在Response结构体里也使用是没问题的，只要会多次用到的类型都建议声明成正常的结构体类型。

还是那句话匿名结构体只在你觉得"这还要定义个类型？”时候使用，用好的确实能提高点代码生产效率。

总结

本次的分享就到这里了，内容比较简单，记住这个口诀：匿名结构体只在你写代码时觉得这还要定义个类型，感觉没必要的时候使用，采纳这个技巧，时间长了还是能看到一些自己效率的提高的。

前言

家里床头离开关太远了，每次躺在床上玩手机准备睡觉时候还的下去关灯，着实麻烦，所以用目前仅有的一点单片机知识，做了一个小小小的智能开关，他有三个模块构成，如下：

1. 主模块是ESP32（20元）

   他是一个低成本、低功耗的微控制器，集成了 Wi-Fi 和蓝牙功能，因为我们需要通过网络去开/关灯，还有一个ESP8266，比这个便宜，大概6 块钱，但是他烧录程序的时候比较慢。

2. 光电开关(10元)

   这个可有可无，这个是用来当晚上下班回家后，开门自动开灯使用的，如果在他前面有遮挡，他的信号线会输出高/低电压，这个取决于买的是常开还是常闭，我买的是常开，当有物体遮挡时，会输出低电压，所以当开门时，门挡住了它，它输出低电压给ESP32，ESP32读取到电压状态后触发开灯动作。

3. 舵机 SG90(5元)

   这是用来触发开/关灯动作的设备，需要把它用胶粘在开关上，他可以旋转0-180度，力度也还行，对于开关足够了。还有一个MG90舵机，力度特别大，但是一定要买180度的，360度的舵机只能正转和反转，不能控制角度。

4. 杜邦线(3元)

Arduino Ide

Arduino是什么就不说了，要烧录代码到ESP32，需要使用官方乐鑫科技提供的ESP-IDF工具，它是用来开发面向ESP32和ESP32-S系列芯片的开发框架，但是，Arduino Ide提供了一个核心，封装了ESP-IDF一些功能，便于我们更方便的开发，当然Arduino还有适用于其他开发板的库。

Arduino配置ESP32的开发环境比较简单，就是点点点、选选选即可。

接线

下面就是接线环节，先看下ESP32的引脚，他共有30个引脚，有25个GPIO(通用输入输出)引脚，如下图中紫色的引脚，在我们的这个设备里，舵机和光电开关都需要接入正负级到下图中的红色(VCC)和黑色(GND)引脚上，而他们都需要在接入一个信号作为输出/输入点，可以在着25个中选择一个，但还是有几个不能使用的，比如有一些引脚无法配置为输出，只用于作输入，还有RX和TX，我们这里使用26(光电开关)和27(舵机)引脚就可以了。

esp32代码

下面写一点点代码，主要逻辑很简单，创建一个http服务器，用于通过外部去控制舵机的转向，外部通过http请求并附带一个角度参数，在通过ESP32Servo这个库去使舵机角度发生改变。

esp32的wifi有以下几种模式。

1. Station Mode（STA模式）： 在STA模式下，esp32可以连接到一个wifi，获取一个ip地址，并且可以与网络中的其他设备进行通信。
2. Access Point Mode（AP模式）： 在AP模式下，它充当wifi热点，其他设备可以连接到esp32，就像连接到普通路由器一样，一般用作配置模式使用，经常买到的智能设备，进入配置模式和后，他会开一个热点，你的手机连接到这个热点后，在通过他们提供的app去配置，就是用这种模式。
3. Soft Access Point Mode（SoftAP模式）： 同时工作在STA模式和AP模式下。

下一步根据自己的逻辑，比如当光电开关被遮挡时，并且又是xxxx时，就开灯，或者当xxx点后就关灯。

#include 

#include 

#include 

#include 

#include 

#define SERVO_PIN_NUMBER 27

#define STATE_PIN_NUMBER 26

#define CLOSE_VALUE 40

#define OPEN_VALUE 150

const char* ssid = "wifi名称";

const char* password = "wifi密码";



AsyncWebServer server(80);

Servo systemServo;



bool openState = false;

void setup() {

  Serial.begin(115200);

  WiFi.mode(WIFI_AP_STA);

  WiFi.begin(ssid, password);

  Serial.println("\nConnecting");



  while (WiFi.status() != WL_CONNECTED) {

    Serial.print(".");

    delay(100);



  }

  systemServo.attach(SERVO_PIN_NUMBER);

  systemServo.write(90);

  openState = false;

  write_state(CLOSE_VALUE);//启动时候将灯关闭



  Serial.print("Local ESP32 IP: ");

  Serial.println(WiFi.localIP());

  pinMode(STATE_PIN_NUMBER, INPUT);

  int timezone = 8 * 3600;

  configTime(timezone, 0, "pool.ntp.org");



  server.on("/set_value", HTTP_GET, [](AsyncWebServerRequest * request) {

    if (request->hasParam("value")) {

      String value = request->getParam("value")->value();

      int intValue = value.toInt();

      write_state(intValue);

      request->send(200, "text/plain", "value: " + String(intValue));

    } else {

      request->send(400, "text/plain", "error");

    }

  });

  server.begin();

}



void write_state(int value) {

  openState = value < 90 ? false : true;



  systemServo.write(value);

  delay(100);

  systemServo.write(90);

}

void loop() {

  time_t now = time(nullptr);

  struct tm *timeinfo;

  timeinfo = localtime(&now);



  //指定时间关灯

  int currentMin = timeinfo->tm_min;

  int currentHour = timeinfo->tm_hour;

  if (currentHour == 23 && currentMin == 0 && openState ) {

    write_state(CLOSE_VALUE);

    openState = false;

  }

  //下班开灯

  if (digitalRead(STATE_PIN_NUMBER) == 0 && currentHour > 18 && !openState) {

    write_state(OPEN_VALUE);

    openState = true;

  }

}

Android下控制

当然，还得需要通过外部设备进行手动开关，这里就简单写一个Android程序，上面写了一个http服务，访问esp32的ip地址，发起一个http请求就可以了，所以浏览器也可以，但更方便的是app，效果如下。

package com.example.composedemo



import android.content.Context

import android.content.SharedPreferences

import android.os.Bundle

import android.util.Log

import android.view.View

import android.widget.TextView

import androidx.activity.ComponentActivity

import androidx.activity.compose.setContent

import androidx.compose.foundation.layout.Row

import androidx.compose.foundation.layout.fillMaxSize

import androidx.compose.material.*

import androidx.compose.runtime.*

import androidx.compose.ui.Modifier

import androidx.compose.ui.graphics.Color

import androidx.compose.ui.tooling.preview.Preview

import com.example.composedemo.ui.theme.ComposeDemoTheme

import kotlinx.coroutines.Dispatchers

import kotlinx.coroutines.GlobalScope

import kotlinx.coroutines.launch

import kotlinx.coroutines.withContext

import java.net.HttpURLConnection

import java.net.URL



class MainActivity : ComponentActivity() {

    private val state = State()

    private lateinit var sharedPreferences: SharedPreferences

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        sharedPreferences = getPreferences(Context.MODE_PRIVATE)

        state.ipAddressChange = {

            with(sharedPreferences.edit()) {

                putString("ipAddress", it)

                apply()

            }

        }

        state.slideChange = {setValue(it) }

        state.lightChange = {

            Log.i(TAG, "onCreate: $it")

            if (it) openLight()

            if (!it) closeLight()

        }

        state.esp32IpAddress.value = sharedPreferences.getString("ipAddress", "")!!



        setContent {

            ComposeDemoTheme {

                Surface(

                    modifier = Modifier.fillMaxSize(),

                    color = MaterialTheme.colors.background

                ) {

                    SlidingOvalLayout(state)

                }

            }

        }

    }



    private fun closeLight() =setValue(40)



    private fun openLight() = setValue(150)



    private fun setValue(value: Int) {

        sendHttpRequest("http://${state.esp32IpAddress.value}/set_value/?value=$value:")

    }



    private fun sendHttpRequest(url: String) {

        GlobalScope.launch(Dispatchers.IO) {

            try {

                val connection = URL(url).openConnection() as HttpURLConnection

                connection.requestMethod = "GET"

                connection.connect()

                if (connection.responseCode == HttpURLConnection.HTTP_OK) {

                    val response = connection.inputStream.bufferedReader().readText()

                    withContext(Dispatchers.Main) {

                    }

                } else {

                    withContext(Dispatchers.Main) {

                    }

                }

                connection.disconnect()

            } catch (e: Exception) {

                e.printStackTrace()

                withContext(Dispatchers.Main) {

                }

            }

        }

    }

}





@Preview(showBackground = true)

@Composable

fun DefaultPreview() {

    ComposeDemoTheme {

    }

}

ui组件

package com.example.composedemo



import androidx.compose.foundation.background

import androidx.compose.foundation.clickable

import androidx.compose.foundation.layout.*

import androidx.compose.foundation.shape.RoundedCornerShape

import androidx.compose.material.*

import androidx.compose.runtime.*

import androidx.compose.ui.Alignment

import androidx.compose.ui.Modifier

import androidx.compose.ui.draw.shadow

import androidx.compose.ui.geometry.Offset

import androidx.compose.ui.graphics.Color

import androidx.compose.ui.graphics.graphicsLayer

import androidx.compose.ui.input.pointer.pointerInput

import androidx.compose.ui.layout.layout

import androidx.compose.ui.tooling.preview.Preview

import androidx.compose.ui.unit.Dp

import androidx.compose.ui.unit.IntOffset

import androidx.compose.ui.unit.dp

import com.example.composedemo.ui.theme.ComposeDemoTheme



const val TAG = "TAG"



@Composable

fun SlidingOvalLayout(state: State) {

    var offset by remember { mutableStateOf(Offset(0f, 0f)) }

    var parentWidth by remember { mutableStateOf(0) }

    var sliderValue by remember { mutableStateOf(0) }

    var closeStateColor by remember { mutableStateOf(Color(0xFFDF2261)) }

    var openStateColor by remember { mutableStateOf(Color(0xFF32A34B)) }

    Box(

        modifier = Modifier

            .fillMaxSize()

            .padding(40.dp)

            .width(100.dp)

    ) {

        Column(

            modifier = Modifier

                .fillMaxSize()

                .padding(16.dp),

            verticalArrangement = Arrangement.SpaceBetween,

            horizontalAlignment = Alignment.CenterHorizontally

        ) {

            Column {

                Box() {

                    TextField(

                        value = state.esp32IpAddress.value,

                        onValueChange = {

                            state.esp32IpAddress.value = it

                            state.ipAddressChange(it)

                        },

                        colors = TextFieldDefaults.textFieldColors(

                            disabledTextColor = Color.Transparent,

                            backgroundColor = Color(0xFFF1EEF1),

                            focusedIndicatorColor = Color.Transparent,

                            unfocusedIndicatorColor = Color.Transparent,

                            disabledIndicatorColor = Color.Transparent

                        ),

                        modifier = Modifier

                            .fillMaxWidth()

                            .background(color = Color(0xFFF1EEF1))

                    )



                }

                Box() {

                    Column() {

                        Text(text = sliderValue.toString())

                        Row(

                            verticalAlignment = Alignment.CenterVertically,

                            horizontalArrangement = Arrangement.spacedBy(8.dp)

                        ) {

                            Slider(

                                value = sliderValue.toFloat(),

                                onValueChange = {

                                    sliderValue = it.toInt()

                                    state.slideChange(sliderValue)},

                                valueRange = 0f..180f,

                                onValueChangeFinished = {



                                },

                                colors = SliderDefaults.colors(

                                    thumbColor = Color.Blue,

                                    activeTrackColor = Color.Blue

                                )

                            )

                        }

                    }



                }

            }

            Box(

                modifier = Modifier

                    .fillMaxWidth()

                    .height(70.dp)

                    .shadow(10.dp, shape = RoundedCornerShape(100.dp))

                    .background(color = Color(0xFFF1EEF1))

                    .layout { measurable, constraints ->

                        val placeable = measurable.measure(constraints)

                        parentWidth = placeable.width

                        layout(placeable.width, placeable.height) {

                            placeable.place(0, 0)

                        }

                    }

            ) {

                Box(

                    modifier = Modifier

                        .offset {

                            if (state.lightValue.value) {

                                IntOffset((parentWidth - 100.dp.toPx()).toInt(), 0)

                            } else {

                                IntOffset(0, 0)

                            }

                        }

                        .graphicsLayer {

                            translationX = offset.x

                        }

                        .clickable() {

                            state.lightValue.value = !state.lightValue.value

                            state.lightChange(state.lightValue.value )

                        }

                        .pointerInput(Unit) {

                        }

                        .background(

                            color = if(state.lightValue.value) openStateColor  else closeStateColor,

                            shape = RoundedCornerShape(100.dp)

                        )

                        .size(Dp(100f), Dp(80f))

                )

            }

        }

    }

}



@Preview

@Composable

fun PreviewSlidingOvalLayout() {

    ComposeDemoTheme {

    }

}

class State {

    var esp32IpAddress: MutableState = mutableStateOf("")

    var lightValue :MutableState<Boolean> = mutableStateOf(false)



    var ipAddressChange :(String)->Unit={}



    var slideChange:(Int)->Unit={}



    var lightChange:(Boolean)->Unit={}



}

作者：i听风逝夜
来源：juejin.cn/post/7292245569482407988

接口方式隐藏传入参数的细节

当方法的入参是一个结构体的时候，内部去调用时会看到入参过多的细节，这个时候可以将入参隐式转成结构，让内部只看到需要的方法即可。

type Kubelet struct{}



func (kl *Kubelet) HandlePodAdditions(pods []*Pod) {

	for _, pod := range pods {

		fmt.Printf("create pods : %s\n", pod.Status)

	}

}



func (kl *Kubelet) Run(updates <-chan Pod) {

	fmt.Println(" run kubelet")

	go kl.syncLoop(updates, kl)

}



func (kl *Kubelet) syncLoop(updates <-chan Pod, handler SyncHandler) {

	for {

		select {

		case pod := <-updates:

			handler.HandlePodAdditions([]*Pod{&pod})

		}

	}

}



type SyncHandler interface {

	HandlePodAdditions(pods []*Pod)

}

这里我们可以看到 Kubelet 本身有比较多的方法：

• syncLoop 同步状态的循环


• Run 用来启动监听循环


• HandlePodAdditions 处理Pod增加的逻辑

由于 syncLoop 其实并不需要知道 kubelet 上其他的方法，所以通过 SyncHandler 接口的定义，让 kubelet 实现该接口后，外面作为参数传入给 syncLoop ，它就会将类型转换为 SyncHandler 。

经过转换后 kubelet 上其他的方法在入参里面就看不到了，编码时就可以更加专注在 syncLoop 本身逻辑的编写。

但是这样做同样会带来一些问题，第一次研发的需求肯定是能满足我们的抽象，但是随着需求的增加和迭代，我们在内部需要使用 kubelet 其他未封装成接口的方法时，我们就需要额外传入 kubelet 或者是增加接口的封装，这都会增加我们的编码工作，也破坏了我们最开始的封装。

分层隐藏设计是我们设计的最终目的，在代码设计的过程中让一个局部关注到它需要关注的东西即可。

接口封装方便Mock测试

通过接口的抽象，我们在测试的时候可以把不关注的内容直接实例化成一个 Mock 的结构。

type OrderAPI interface {

	GetOrderId() string

}



type realOrderImpl struct{}



func (r *realOrderImpl) GetOrderId() string {

	return ""

}



type mockOrderImpl struct{}



func (m *mockOrderImpl) GetOrderId() string {

	return "mock"

}

这里如果测试的时候不需要关注 GetOrderId 的方法是否正确，则直接用 mockOrderImpl 初始化 OrderAPI 即可，mock的逻辑也可以进行复杂编码

func TestGetOrderId(t *testing.T) {

	orderAPI := &mockOrderImpl{} // 如果要获取订单id，且不是测试的重点，这里直接初始化成mock的结构体

	fmt.Println(orderAPI.GetOrderId())

}

gomonkey 也同样能进行测试注入，所以如果以前的代码没能够通过接口封装也同样可以实现mock，而且这种方式更加强大

patches := gomonkey.ApplyFunc(GetOrder, func(orderId string) Order {

		return Order{

			OrderId:    orderId,

			OrderState: delivering,

		}

	})

	return func() {

		patches.Reset()

	}

使用 gomonkey 能够更加灵活的进行 mock ， 它能直接设置一个方法的返回值，而接口的抽象只能够处理结构体实例化出来的内容。

接口封装底层多种实现

iptables 、ipvs等的实现就是通过接口的抽象来实现，因为所有网络设置都需要处理 Service 和 Endpoint ，所以抽象了 ServiceHandler 和 EndpointSliceHandler

// ServiceHandler 是一个抽象接口，用于接收有关服务对象更改的通知。

type ServiceHandler interface {

    // OnServiceAdd 在观察到创建新服务对象时调用。

    OnServiceAdd(service *v1.Service)

    // OnServiceUpdate 在观察到现有服务对象的修改时调用。

    OnServiceUpdate(oldService, service *v1.Service)

    // OnServiceDelete 在观察到现有服务对象的删除时调用。

    OnServiceDelete(service *v1.Service)

    // OnServiceSynced 一旦所有初始事件处理程序都被调用并且状态完全传播到本地缓存时调用。

    OnServiceSynced()

}



// EndpointSliceHandler 是一个抽象接口，用于接收有关端点切片对象更改的通知。

type EndpointSliceHandler interface {

    // OnEndpointSliceAdd 在观察到创建新的端点切片对象时调用。

    OnEndpointSliceAdd(endpointSlice *discoveryv1.EndpointSlice)

    // OnEndpointSliceUpdate 在观察到现有端点切片对象的修改时调用。

    OnEndpointSliceUpdate(oldEndpointSlice, newEndpointSlice *discoveryv1.EndpointSlice)

    // OnEndpointSliceDelete 在观察到现有端点切片对象的删除时调用。

    OnEndpointSliceDelete(endpointSlice *discoveryv1.EndpointSlice)

    // OnEndpointSlicesSynced 一旦所有初始事件处理程序都被调用并且状态完全传播到本地缓存时调用。

    OnEndpointSlicesSynced()

}

然后通过 Provider 注入即可，

type Provider interface {

	config.EndpointSliceHandler

	config.ServiceHandler

}

这个也是我在做组件的时候用的最多的一种编码技巧，通过将类似的操作进行抽象，能够在替换底层实现后，上层代码不发生改变。

封装异常处理

我们开启协程之后如果不对异常进行捕获，则会导致协程出现异常后直接 panic ，但是每次写一个 recover 的逻辑做全局类似的处理未免不太优雅，所以通过封装 HandleCrash 方法来实现。

package runtime



var (

	ReallyCrash = true

)



// 全局默认的Panic处理

var PanicHandlers = []func(interface{}){logPanic}



// 允许外部传入额外的异常处理

func HandleCrash(additionalHandlers ...func(interface{})) {

	if r := recover(); r != nil {

		for _, fn := range PanicHandlers {

			fn(r)

		}

		for _, fn := range additionalHandlers {

			fn(r)

		}

		if ReallyCrash {

			panic(r)

		}

	}

}

这里既支持了内部异常的函数处理，也支持外部传入额外的异常处理，如果不想要 Crash 的话也可以自己进行修改。

package runtime



func Go(fn func()) {

	go func() {

		defer HandleCrash()

		fn()

	}()

}

要起协程的时候可以通过 Go 方法来执行，这样也避免了自己忘记增加 panic 的处理。

waitgroup的封装

import "sync"



type Gr0up struct {

	wg sync.WaitGr0up

}



func (g *Gr0up) Wait() {

	g.wg.Wait()

}



func (g *Gr0up) Start(f func()) {

	g.wg.Add(1)

	go func() {

		defer g.wg.Done()

		f()

	}()

}

这里最主要的是 Start 方法，内部将 Add 和 Done 进行了封装，虽然只有短短的几行代码，却能够让我们每次使用 waitgroup 的时候不会忘记去对计数器增加一和完成计数器。

信号量触发逻辑封装

type BoundedFrequencyRunner struct {

	sync.Mutex



	// 主动触发

	run chan struct{}



	// 定时器限制

	timer *time.Timer



	// 真正执行的逻辑

	fn func()

}



func NewBoundedFrequencyRunner(fn func()) *BoundedFrequencyRunner {

	return &BoundedFrequencyRunner{

		run:   make(chan struct{}, 1),

		fn:    fn,

		timer: time.NewTimer(0),

	}

}



// Run 触发执行 ,这里只能够写入一个信号量，多余的直接丢弃，不会阻塞，这里也可以根据自己的需要增加排队的个数

func (b *BoundedFrequencyRunner) Run() {

	select {

	case b.run <- struct{}{}:

		fmt.Println("写入信号量成功")

	default:

		fmt.Println("已经触发过一次，直接丢弃信号量")

	}

}



func (b *BoundedFrequencyRunner) Loop() {

	b.timer.Reset(time.Second * 1)

	for {

		select {

		case <-b.run:

			fmt.Println("run 信号触发")

			b.tryRun()

		case <-b.timer.C:

			fmt.Println("timer 触发执行")

			b.tryRun()

		}

	}

}



func (b *BoundedFrequencyRunner) tryRun() {

	b.Lock()

	defer b.Unlock()

	// 可以增加限流器等限制逻辑

	b.timer.Reset(time.Second * 1)

	b.fn()

}

写在最后

感谢你读到这里，如果想要看更多 Kubernetes 的文章可以订阅我的专栏： juejin.cn/column/7321… 。

今天，我想谈谈相当简单的事情。我不会发明什么，但我在生产代码中经常看到这样的事情，所以我不能回避这个话题。

我经常要解开多个复杂的 if else 结构。多余的缩进、过多的逻辑只会加深理解。首先，这篇文章的主要目的是让代码更透明、更易读。不过，在某些情况下还是必须使用这些操作符。

else 操作

例如，我们有简单的用户处理程序：

func handleRequest(user *User) {

    if user != nil {

        showUserProfilePage(user)

    } else {

        showLoginPage()

    }

}

如果没有提供用户，则需要将收到的请求重定向到登录页面。If else 似乎是个不错的决定。但我们的主要任务是确保业务逻辑单元在任何输入情况下都能正常工作。因此，让我们使用提前返回来实现这一点。

func handleRequest(user *User) {

    if user == nil {

        return showLoginPage()

    } 

    showUserProfilePage(user)

}

逻辑是一样的，但是下面的做法可读性会更强。

break 操作

对我来说，Break 和 Continue 语句总是可以分解的信号。

例如，我们有一个简单的搜索任务。找到目标并执行一些业务逻辑，或者什么都不做。

func processData(data []int, target int) {

    for i, value := range data {

        if value == target {

            performActionForTarget(data[i])

            break

        }

    }

}

你应该始终记住，使用 break 操作符并不能保证整个数组都会被处理。这对性能有好处，因为我们丢弃了不必要的迭代，但对代码支持和可读性不利。因为我们永远不知道程序会在列表的开头还是结尾停止。

在某些情况下，带有子任务的简单功能可能会破坏这段代码。

func processData(data []int, target int, subtask int) {

    for i, value := range data {

        if value == subtask {

            performActionForSubTarget(data[i])

        }

        if value == target {

            performActionForTarget(data[i])

            break

        }

    }

}

这样我们实际上可以拆出一个 find 的方法：

func processData(data []int, target int, subTarget int) {

    found := findTarget(data, target)

    if found > notFound {

        performActionForTarget(found)

    }



    found = findTarget(data, subTarget)

    if found > notFound {

        performActionForSubTarget(found)

    }

}



const notFound = -1



func findTarget(data []int, target int) int {

    if len(data) == 0 {

        return notFound

    }



    for _, value := range data {

        if value == target {

            return value

        }

    }



    return notFound

}

同样的逻辑，但是拆分成更细粒度的方法，也有精确的返回语句，可以很容易地通过测试来实现。

continue 操作

该操作符与 break 类似。为了正确阅读代码，您应该牢记它对操作顺序的具体影响。

func processWords(words []string, substring string) {

    for _, word := range words {

        if !strings.Contains(word, substring) {

            continue

        }

        

        // do some buisness logic

        performAction(word)

    }

}

Continue 使得这种简单的流程变得有点难以理解。

让我们写得更简洁些：

func processWords(words []string, substring string) {

    for _, word := range words {

        if strings.Contains(word, substring) {

            performAction(word)

        }

    }

}

为什么很多人不推荐你用JWT?

如果你经常看一些网上的带你做项目的教程，你就会发现 有很多的项目都用到了JWT。那么他到底安全吗？为什么那么多人不推荐你去使用。这个文章将会从全方面的带你了解JWT 以及他的优缺点。

什么是JWT?

这个是他的官网JSON Web Tokens - jwt.io

这个就是JWT

JWT 全称JSON Web Token

如果你还不熟悉JWT，不要惊慌！它们并不那么复杂！

你可以把JWT想象成一些JSON数据，你可以验证这些数据是来自你认识的人。

当然如何实现我们在这里不讲，有兴趣的可以去自己了解。

下面我们来说一下他的流程：

为什么说JWT很烂？

首先我们用JWT应该就是去做这些事情：

• 用户注册网站


• 用户登录网站


• 用户点击并执行操作


• 本网站使用用户信息进行创建、更新和删除 信息

这些事情对于数据库的操作经常是这些方面的

• 记录用户正在执行的操作


• 将用户的一些数据添加到数据库中


• 检查用户的权限，看看他们是否可以执行某些操作

之后我们来逐步说出他的一些缺点

大小

这个方面毋庸置疑。

比如我们需要存储一个用户ID 为xiaou

如果存储到cookie里面，我们的总大小只有5个字节。

如果我们将 ID 存储在 一个 JWT 里。他的大小就会增加大概51倍

这无疑就增大了我们的宽带负担。

冗余签名

JWT的主要卖点之一就是其加密签名。因为JWT被加密签名，接收方可以验证JWT是否有效且可信。

但是，在过去20年里几乎每一个网络框架都可以在使用普通的会话cookie时获得加密签名的好处。

事实上，大多数网络框架会自动为你加密签名（甚至加密！）你的cookie。这意味着你可以获得与使用JWT签名相同的好处，而无需使用JWT本身。

实际上，在大多数网络身份验证情况下，JWT数据都是存储在会话cookie中的，这意味着现在有两个级别的签名。一个在cookie本身上，一个在JWT上。

令牌撤销问题

由于令牌在到期之前一直有效，服务器没有简单的方法来撤销它。

以下是一些可能导致这种情况危险的用例。

注销并不能真正使你注销！

想象一下你在推特上发送推文后注销了登录。你可能会认为自己已经从服务器注销了，但事实并非如此。因为JWT是自包含的，将在到期之前一直有效。这可能是5分钟、30分钟或任何作为令牌一部分设置的持续时间。因此，如果有人在此期间获取了该令牌，他们可以继续访问直到它过期。

可能存在陈旧数据

想象一下用户是管理员，被降级为权限较低的普通用户。同样，这不会立即生效，用户将继续保持管理员身份，直到令牌过期。

JWT通常不加密

因此任何能够执行中间人攻击并嗅探JWT的人都拥有你的身份验证凭据。这变得更容易，因为中间人攻击只需要在服务器和客户端之间的连接上完成

安全问题

对于JWT是否安全。我们可以参考这个文章

JWT （JSON Web Token） （in）security - research.securitum.com

同时我们也可以看到是有专门的如何攻击JWT的教程的

高级漏洞篇之JWT攻击专题 - FreeBuf网络安全行业门户

总结

总的来说，JWT适合作为单次授权令牌，用于在两个实体之间传输声明信息。

但是，JWT不适合作为长期持久数据的存储机制，特别是用于管理用户会话。使用JWT作为会话机制可能会引入一系列严重的安全和实现上的问题，相反，对于长期持久数据的存储，更适合使用传统的会话机制，如会话cookie，以及建立在其上的成熟的实现。

但是写了这么多，我还是想说，如果你作为自己开发学习使用，不考虑安全，不考虑性能的情况下，用JWT是完全没有问题的，但是一旦用到生产环境中，我们就需要避免这些可能存在的问题。

今天收到一个需求,要求在flutter端把任意类型的图片,转换成bmp类型的图片,然后把 bmp位图发送到条码打印机,生成的 bmp图片是 1 位深度的,只有黑白两种像素颜色

包已经上传到 pub.dev,pub.dev/packages/ld…

效果图

1.生成插件包

crates.io地址: crates.io/crates/frb_…
安装命令

cargo install frb_plugin_tool

使用很简单,输入frb_plugin_tool即可

按照提示输入插件名
创建后的项目目录大概像这样

2. 编写 rust代码

我这里图片转 bmp工具用的是rust image这个包

添加依赖

cd rust && cargo add image

然后在 src/api目录下添加image.rs文件

use std::{io::Cursor, time::Instant};



use bytesize::ByteSize;

use humantime::format_duration;

use image::{GrayImage, Luma};

use indicatif::ProgressBar;

use log::debug;



use super::entitys::{LddImageType, ResizeOpt};



///任意图像转 1 位深度的数据

pub fn convert_to_1bit_bmp(

    input_data: &[u8],

    image_type: LddImageType,

    resize: Option<ResizeOpt>,

    is_apply_ordered_dithering: Option<bool>,

) -> Vec<u8> {

    let use_ordered_dithering = is_apply_ordered_dithering.map_or(false, |v| v);

    let start = Instant::now();

    debug!("开始转换,数据大小:{:?}", ByteSize(input_data.len() as u64));

    let mut img =

        image::load(Cursor::new(input_data), image_type.int0()).expect("Failed to load image");



    if let Some(size) = resize {

        debug!("开始格式化尺寸:{:?}", size);

        img = img.resize(size.width, size.height, size.filter.int0());

        debug!("✅格式化尺寸完成");

    }



    let mut gray_img = img.to_luma8(); // 转换为灰度图像

    if use_ordered_dithering {

        debug!("✅使用 h4x4a 抖动算法");

        gray_img = apply_ordered_dithering(&gray_img);

    }



    let (width, height) = gray_img.dimensions();

    let row_size = ((width + 31) / 32) * 4; // 每行字节数 4 字节对齐

    let mut bmp_data = vec![0u8; row_size as usize * height as usize];



    // 创建进度条

    let progress_bar = ProgressBar::new(height as u64);



    // 二值化处理并填充 BMP 数据（1 位深度）

    let threshold = 128;

    for y in 0..height {

        let inverted_y = height - 1 - y; // 倒置行顺序

        for x in 0..width {

            let pixel = gray_img.get_pixel(x, y)[0];

            if pixel >= threshold {

                bmp_data[inverted_y as usize * (row_size as usize) + (x / 8) as usize] |=

                    1 << (7 - (x % 8));

            }

        }

        progress_bar.inc(1); // 每处理一行，进度条增加一格

    }



    progress_bar.finish_with_message("Conversion complete!");



    // BMP 文件头和 DIB 信息头

    let file_size = 14 + 40 + 8 + bmp_data.len(); // 文件头 + DIB 头 + 调色板 + 位图数据

    let bmp_header = vec![

        0x42,

        0x4D, // "BM"

        (file_size & 0xFF) as u8,

        ((file_size >> 8) & 0xFF) as u8,

        ((file_size >> 16) & 0xFF) as u8,

        ((file_size >> 24) & 0xFF) as u8,

        0x00,

        0x00, // 保留字段

        0x00,

        0x00, // 保留字段

        54 + 8,

        0x00,

        0x00,

        0x00, // 数据偏移（54 字节 + 调色板大小）

    ];



    let dib_header = vec![

        40,

        0x00,

        0x00,

        0x00, // DIB 头大小（40 字节）

        (width & 0xFF) as u8,

        ((width >> 8) & 0xFF) as u8,

        ((width >> 16) & 0xFF) as u8,

        ((width >> 24) & 0xFF) as u8,

        (height & 0xFF) as u8,

        ((height >> 8) & 0xFF) as u8,

        ((height >> 16) & 0xFF) as u8,

        ((height >> 24) & 0xFF) as u8,

        1,

        0x00, // 颜色平面数

        1,

        0x00, // 位深度（1 位）

        0x00,

        0x00,

        0x00,

        0x00, // 无压缩

        0x00,

        0x00,

        0x00,

        0x00, // 图像大小（可为 0，表示无压缩）

        0x13,

        0x0B,

        0x00,

        0x00, // 水平分辨率（2835 像素/米）

        0x13,

        0x0B,

        0x00,

        0x00, // 垂直分辨率（2835 像素/米）

        0x02,

        0x00,

        0x00,

        0x00, // 调色板颜色数（2）

        0x00,

        0x00,

        0x00,

        0x00, // 重要颜色数（0 表示所有颜色都重要）

    ];



    // 调色板（黑白）

    let palette = vec![

        0x00, 0x00, 0x00, 0x00, // 黑色

        0xFF, 0xFF, 0xFF, 0x00, // 白色

    ];



    // 将所有部分组合成 BMP 文件数据

    let mut bmp_file_data = Vec::with_capacity(file_size);

    bmp_file_data.extend(bmp_header);

    bmp_file_data.extend(dib_header);

    bmp_file_data.extend(palette);

    bmp_file_data.extend(bmp_data);



    let duration = start.elapsed(); // 计算耗时

    debug!(

        "✅转换完成,数据大小:{:?},耗时:{}",

        ByteSize(bmp_file_data.len() as u64),

        format_duration(duration)

    );

    bmp_file_data

}



// 有序抖动矩阵（4x4 Bayer 矩阵）

const DITHER_MATRIX: [[f32; 4]; 4] = [

    [0.0, 8.0, 2.0, 10.0],

    [12.0, 4.0, 14.0, 6.0],

    [3.0, 11.0, 1.0, 9.0],

    [15.0, 7.0, 13.0, 5.0],

];



//h4x4a 抖动算法

fn apply_ordered_dithering(image: &GrayImage) -> GrayImage {

    let (width, height) = image.dimensions();

    let mut dithered_image = GrayImage::new(width, height);



    for y in 0..height {

        for x in 0..width {

            let pixel = image.get_pixel(x, y)[0];

            let threshold = DITHER_MATRIX[(y % 4) as usize][(x % 4) as usize] / 16.0 * 255.0;

            let new_pixel_value = if pixel as f32 > threshold { 255 } else { 0 };

            dithered_image.put_pixel(x, y, Luma([new_pixel_value]));

        }

    }



    dithered_image

}

生成 dart代码,在项目根目录下执行

flutter_rust_bridge_codegen generate

会在dart lib下生成对应的文件

在项目中使用

编写 example , main.dart.

import 'dart:io';

import 'dart:typed_data';



import 'package:file_picker/file_picker.dart';

import 'package:flutter/material.dart';

import 'package:ldd_bmp/api/entitys.dart';

import 'package:ldd_bmp/api/image.dart';

import 'package:ldd_bmp/ldd_bmp.dart';

import 'dart:async';



import 'package:path_provider/path_provider.dart';



const reSize = ResizeOpt(

  width: 200,

  height: 200,

  filter: LddFilterType.nearest,

);



Future<void> main() async {

  await bmpSdkInit();

  runApp(const MyApp());

}



class MyApp extends StatefulWidget {

  const MyApp({super.key});



  @override

  State<MyApp> createState() => _MyAppState();

}



class _MyAppState extends State<MyApp> {

  File? file;

  Uint8List? bmpData;

  @override

  void initState() {

    super.initState();

  }



  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      home: Scaffold(

        appBar: AppBar(

          title: const Text('Native Packages'),

        ),

        body: SingleChildScrollView(

          child: Column(

            children: [

              FilledButton(onPressed: selectFile, child: const Text('选择文件')),

              if (file != null)

                Image.file(

                  file!,

                  width: 200,

                  height: 200,

                ),

              ElevatedButton(

                  onPressed: file == null

                      ? null

                      : () async {

                          final bts = await file!.readAsBytes();

                          bmpData = await convertTo1BitBmp(

                              inputData: bts,

                              imageType: LddImageType.jpeg,

                              isApplyOrderedDithering: true,

                              resize: const ResizeOpt(

                                width: 200,

                                height: 200,

                                filter: LddFilterType.nearest,

                              ));

                          setState(() {});

                        },

                  child: const Text("转换")),

              ElevatedButton(

                  onPressed: bmpData == null

                      ? null

                      : () {

                          saveImageToFile(bmpData!);

                        },

                  child: const Text("保存图片"))

            ],

          ),

        ),

        floatingActionButton: bmpData != null

            ? ConstrainedBox(

                constraints:

                    const BoxConstraints(maxHeight: 300, maxWidth: 300),

                child: Card(

                  elevation: 10,

                  child: Padding(

                    padding: const EdgeInsets.all(8.0),

                    child: Column(

                      children: [

                        const Text('转换结果'),

                        Image.memory(bmpData!),

                      ],

                    ),

                  ),

                ),

              )

            : null,

      ),

    );

  }



  Future<void> selectFile() async {

    setState(() {

      file = null;

    });

    FilePickerResult? result = await FilePicker.platform.pickFiles();

    if (result != null) {

      file = File(result.files.single.path!);

      setState(() {});

    } else {

      // User canceled the picker

    }

  }

}



Future<void> saveImageToFile(Uint8List imageData) async {

  // 获取应用程序的文档目录

  final directory = await getApplicationDocumentsDirectory();



  // 设置文件路径和文件名

  final filePath = '${directory.path}/image.bmp';



  // 创建一个文件对象

  final file = File(filePath);



  // 将Uint8List数据写入文件

  await file.writeAsBytes(imageData);



  print('Image saved to $filePath');

}

转换速度还是挺快的,运行效果

上传到 pub.dev

这个包已经上传到仓库了,可以直接使用
pub.dev/packages/ld…

介绍

本篇文章主要以innodb存储引擎为主；在了解mysql的过程中经常能听到它内部有各种log以及缓冲区，他们在mysql中具有重要作用，例如binlog可以进行主从恢复，undo log可以进行数据回滚等。这篇文章主要讲解在mysql运气期间每个区域都是用来做什么的。

写入数据流程

对于mysql来讲，读写任何数据都是在内存中进行操作的；下图为mysql写入数据的详细流程：

undo log

undo log记录事务开始前的数据状态，它主要用于数据回滚和实现MVCC：

• 回滚操作：undo log记录了事务开始前的数据状态，当事务需要回滚时，以便可以恢复到原始状态。


• 多版本并发控制（MVCC） ：在读取历史数据时，undo log允许读取到事务开始前的数据版本，从而实现非锁定读取。

MVCC的具体实现可以查看:MVCC实现

buffer pool

innodb中无论是查询还是写绝大部分都是在buffer pool中进行操作的，它相当于innodb的缓存区，可以通过show engine innodb status来查看buffer pool的使用情况；可以通过innodb_buffer_pool_size来设置buffer pool的大小，线上不要吝啬给几个G内存都是正常的，但无论给多大内存都会有不够的时候，innodb采用了变种的LRU算法对数据页进行淘汰；如下图：

传统的LRU算法当碰到扫描一张大表时可能会直接把buffer pool中的所有页都更换为该表的数据，但这张表可能就使用一次，并不是热点数据；

innodb为了避免这种场景发生，会把整个buffer pool按照 5:3分成了young区域和old区域；其中绿色区域就是young区域也就是热点数据区域，紫色区域就是old区域也就是冷数据区域；整体的淘汰流程为：

在上图中可以看到除了LRU链表还有一个Flush链表，它是用来管理脏页的；在写入数据时绝大部分都会先写入buffer pool中，再更改buffer pool中的页数据时，该页就变成了脏页，此时就会被加入到flush链表中，定时会把flush中的脏页刷到.idb数据文件中。

change buffer

在介绍buffer pool时用的是绝大部分操作，是因为在innodb中还存在change buffer，还有一部分操作是写入change buffer的。change buffer的定义是当需要更新一个数据页时，如果数据页在内存中就直接更新，而如果这个数据页还没有在内存中的话，在不影响数据一致性的前提下，innodb会将这些更新操作缓存在change buffer中，这样就不需要从磁盘中加载这个数据页了，如果有查询需要访问这个数据页的时候，再将数据页读到内存中，然后执行change buffer中与这个页有关的操作，这样就能保证这个数据的正确性。change buffer用的是buffer pool中的内存，可以通过innodb_change_buffer_max_size来设置它占用buffer pool的内存比例。使用change buffer的前提条件是该数据页还没被加载到buffer pool中，并且如果是根据唯一索引进行更新，由于要检查数据的唯一性，必须把数据页加载到buffer pool中是无法享受change buffer带来的收益的。

redo log 与 redo log buffer

redo log是为了防止由于mysql异常退出导致buffer pool中还未持久化的数据丢失而诞生的；
它也是一个环形文件写数据写满时会覆盖历史的数据，它记录了数据页的物理变化，并且是顺序写入的提升了写入的性能；当mysql重启时可以使用redo log来恢复数据。

每次写redo log时并不是直接写入redo log文件，而是写入redo log buffer中，通过三种刷盘策略把数据同步到redo log中，可以通过innodb_flush_log_at_trx_commit参数来控制刷盘的时机

• 0：事务提交时，日志缓冲（log buffer）被写入到日志文件，但并不立即刷新到磁盘。日志文件的刷新操作由后台线程每隔一秒执行一次；


• 1：事务提交时，日志缓冲被写入到日志文件，并立即刷新到磁盘；


• 2：事务提交时，日志缓冲被写入到日志文件，但不立即刷新到磁盘。而是每秒由后台线程将日志文件刷新到磁盘。

如果对数据的正确性要求很高应该设置为1。

注：第一张图流程中，在第5步有二次commit，在数据恢复如果发现一个事务没有commit，则去binlog日志中查询，如果发现binlog中有相应数据则直接恢复，如果没有则丢弃。

binlog

binlog为了高效地记录和传输数据更改信息，它采用了二进制格式存储数据库的更改操作，这样还可以占用更小的存储空间；它可以实现数据恢复、数据同步等功能。默认mysql是关闭binlog日志的，可以通过
在[mysqlId]部分中设置log-bin和server-id来开启binlog日志。它也是在事务提交时才进行数据记录，它有以下三种数据格式：

• Statement：记录每一条执行的sql，但由于mysql中存在一些函数，例如一些随机生成函数，此时数据同步时会发生同步过去的数据不一致；


• Row：记录每行被修改成什么，这样可以解决statement带来的数据不一致问题，但由于记录的太详细如果出现了全表更新，那记录的数据量就会特别大；


• Mixed：Statement和Row的混合体，mysql会根据执行的每一条具体的SQL语句来区别对待记录的日志格式。

总结

为了实现更高的性能，在innodb中的任何操作都是优先在内存中操作的；为了支持数据的数据回滚、MVVC引入了undo log，进而可以实现查询历史版本或数据回滚；同时为了防止异常退出导致的数据丢失引入了redo log；为了支持数据同步等功能mysql引入了binlog日志。这就是各个区域的作用，由于篇幅原因本篇文章只对每个区域做了简单介绍，后续会写各个区域详细内容的文章。

创作不易，觉得文章写得不错帮忙点个赞吧！如转载请标明出处～

介绍解决该问题的基本概念和常见解决方案。

• Lockstep state update 锁步状态更新


• Client prediction 客户端预测


• server reconcilation 服务端和解

多人游戏的运作方式

游戏程序的玩家当前状态随时间和玩家的输入会进行变化。也就是说游戏是有状态的程序。多人游戏也不例外，但由于多人玩家之间存在交互，复杂性会更高。

例如贪吃蛇游戏，我们假设它的操作会发送到服务器，那它的核心游戏逻辑应该是：

服务端接收该消息做出对应的动作，这个过程会以固定的间隔运行。每一次循环都被称为 frame 或 tick。

客户端将解析服务端发送的消息，也就是每一帧的动作，渲染到游戏华中中。

锁步状态更新

为了确保所有客户端都同步帧，最简单的方法是让客户端以固定的间隔向服务器发送更新。发送的消息包含用户的输入，当然也可以发送 no user input。

服务器收集“所有用户”的输入后，就可以生成下一次 frame 帧。

上图演示了客户端与服务端的交互过程。T0 ~ T1 时间段，客户端保持等待，或者说空闲状态，直到服务器响应 frame，等待时间的大小取决于网络质量，约 50 毫秒到 500 毫秒，人眼能够注意到任何超过 100 毫秒的延迟，因此这个等待时间对于某些游戏来说是不可接受的。

锁步状态更新，还有一个问题。游戏的延迟来自最慢的用户 。

上图有两个客户端。客户端 B 的网络比较差，A 和 B 都在 T0 时间点向服务器发送了用户输入，A 的请求在 T1 到达服务端，B 的请求在 T2 到达服务端，前面我们提到，服务器需要收集“所有用户”的请求后才开始工作，因此需要到 T2 时间点才开始生成 frame。

因为 Client B 比较慢，我们“惩罚”了所有的玩家。

假如我们不等待所有客户端的用户输入，低延迟玩家又会获得优势，因为它的输入到达服务器的时间更短，会更快处理。例如，两个玩家 A、B 同时互相射击预期是同时死亡，但是 A 玩家延迟比 B 玩家更低，因此在处理 B 玩家的用户输入时，A 玩家已经干掉 B 玩家了。

小结一下，锁步状态更新存在的问题，如下。

• 游戏画面是否卡顿，取决于最慢的玩家


• 客户端需要等待来自服务器的响应，否则不会渲染画面


• 连接非常活跃，客户端需要定期发送一些无用的心跳包，以便服务器可以确定它拥有生成 frame 所需的所有信息

回合制类型的游戏大多数使用这种方法，因为玩家确实需要等待，例如《炉石传说》。

对于慢节奏的游戏，少量延迟也是可以接受的，例如《QQ农场》。

但是对于快节奏的游戏，锁步状态更新的这些问题都是致命的，不可能操纵游戏人物进入某一个建筑，500 毫秒后，我才能进入。我们一起来看看下一种方法。

客户端预测

客户端预测，在玩家的计算机上，运行游戏逻辑，来模拟游戏的行为，而不是等待服务器更新。

例如我们生成 Tn 时间点的游戏状态，我们需要 Tn-1 时间点的所有玩家状态和 Tn-1 时间点所有玩家的输入。

假设，我们现在的固定频率为 1 s，每 1s 需要给服务器发送一个请求，获取玩家状态并更新玩家的状态。

在 T0 时间点，客户端将用户的输入发送到服务器，用于获取 T1 时间点的游戏状态。在 T1 时间点，客户端已经可以渲染画面了，实际上客户端的响应是在 T3 时刻，也就是说客户端没有等待来自服务器的响应。

使用这个方法，需要满足一些前置条件：

• 客户端拥有游戏运行逻辑所需的所有条件


• 玩家状态的更新逻辑是确定性的，即没有随机性，或者可以以某种方式保证确定性，例如客户端和服务器使用同样的公式以及随机种子，可以保证具有随机性的同时，产生的结果具有确定性。这样保证了客户端和服务器在给定相同输入的情况下产生相同的游戏状态

满足这两点，客户端预测的结果也不一定总是对的。就比如刚提到的，使用相同的公式以及相同的随机种子，进行伪随机算法，但不同平台的浮点计算，可能会存在微小的差异。

再设想一个场景，如下图。

客户端 A 尝试使用 T0 时间点的信息模拟 T1 时间点上的游戏状态，但客户端 B 也在 T0 时间点提交了用户输入，客户端 A 并不知道这个用户输入。

这意味着客户端 A 对 T1 时间的预测将是错误的是，但！由于客户端 A 仍然从服务器接收 T1 时间点的状态，因此客户端有机会在 T3 时间点修正错误。

客户端需要知道，自己的预测是否正确，以及如何修正错误。

修正错误通常叫做 Reconcilation 和解。

需要根据上下文来实现和解部分，下面我们通过一个简单的例子来理解这个概念。这个例子只是抛弃我们的预测，并将其游戏状态替换为服务器响应的正确状态。

• 客户端需要维护 2 个缓冲区，一个用于预测 PredictionBuffer，一个用于用户输入 InputBuffer 。它们是预测这个行为需要的上下文，请记住，预测 Tn 时刻，需要 Tn-1 的状态和 Tn-1 时刻的用户输入。它们一开始都为空
  
  

  



• 玩家点击鼠标，移动游戏角色到下一个位置。此时，玩家输入的移动信息 Input 0 存储在 InputBuffer 中，客户端将生成预测 Prediction 1，存储在 PredictionBuffer 中，预测将展示在玩家画面中
  
  

  



• 客户端收到服务器响应的 State0 ，发现与客户端的预测不匹配，我们将Prediction 1 替换为 State 0，并使用 Input 0 和 State 0 重新计算，得到 Prediction 2，这个重新计算的过程，就是 Reconcilation 和解
  
  

  



• 和解后，我们从缓冲区中删除 State 0 和 Input 0
  
  

  

这种和解的方式有一个明显的缺点，如果服务器响应的游戏状态和客户端预测差异太大，则游戏画面可能会出现错误。例如我们预测敌人在 T0 时间点向南移动，但在 T3 时间点，我们意识到它在向北移动，然后通过使用服务器的响应进行和解，敌人将从北“飞到”正确的位置。

有一些方法可以解决此问题，这里不展开讨论，感兴趣可以搜一下实体插值 Entity Interpolation。

小结一下，客户端预测技术，让客户端以自己的更新频率运行，与服务器的更新频率无关，所以服务器如果出现阻塞，不会影响客户端的帧。

但它也带来复杂性，如下。

• 需要在客户端处理更多的状态和逻辑，比如我们前面提到的缓冲区和预测逻辑


• 需要和解来自服务器的状态（正确的游戏状态）与预测之前的冲突

还给我们带来了敌人从南飞到北的问题。

目前为止，我们都在讨论客户端，接下来看看服务端如何解决帧同步。

服务端和解

利用服务端解决帧同步问题，首先需要解决的是网络延迟带来的问题。如下图。

用户 A 在 T 处进行了操作（比如按下了一个技能键），该操作应该在 T+20ms 处理，但由于延迟，服务器在 T+120ms 才接收到输入。

在游戏中，用户做出指定操作后，应该立即有反应。立即有反应，这个立即是多久，取决于游戏的类型，比如之前我们提到的回合制，它的立即可能是几十秒。我们可以通过 T + X，表示立即反应的时间，T 代表用户的输入时刻，X 代表的是延迟。X 可以为 0，这代表真正的立即 :-)

解决这个问题的思路，与之前客户端预测中使用的办法类似，就是通过客户端的用户输入，来和解服务器中的玩家游戏状态。

所有的用户输入，都需要时间戳进行标记，该时间戳用于告诉服务器，什么时刻处理此用户输入。

为什么在同一水平线上，Client A 的时间是 Time X，而 Server 的时间是 Time Y？

因为客户端和服务端独立运行，通常时间会有所不同，在多人游戏中，我们可以特殊处理其中的差异。在特殊处理时，我们应该使客户端的时间大于服务端的时间，因为这样可以存在更大的灵活性

上图演示了一个客户端与服务端之间的交互。

服务端和解部分（上图红色底色部分），主要维护 3 个部分，如下。

• GameStateHistory，在一定时间范围内玩家在游戏中的状态


• ProcessedUserInput，在一定时间范围内处理的用户输入的历史记录


• UnprocessedUserInput，已收到但未处理的用户输入，也是在一定的时间内

服务端和解过程，如下。

我并没有做过这些工作，分享的知识都是我对它感兴趣，在网上看了许多经验后整理的。

如何让你喜欢的原神角色陪你写代码

每天上班，脑子里面就想着一件事，原神，啊不对，VsCode！启动！(doge 狗头保命)，那么如何将这两件事情结合起来呢？特别是原神里面有那么多我喜欢的角色。

最终效果预览

• 右下角固定一只小可爱
  
  
  
  
  • 
  
  
  
  


• 全屏一只小可爱
  
  
  
  
  • 
  
  
  
  

省流直接抄作业版

{

  "background.customImages": [

    "https://upload-bbs.miyoushe.com/upload/2023/02/24/196231062/8540249f2c0dd72f34c8236925ef45bc_3880538836005347690.png",

    "https://user-images.githubusercontent.com/41776735/163673800-0e575aa3-afab-405b-a833-212474a51adc.png"

  ],

  "background.enabled": true,

  "background.style": {

    "content": "''",

    "width": "30%",

    "height": "30%",

    "opacity": 0.3,

    "position": "absolute",

    "bottom": "0",

    "right": "7%",

    "z-index": "99999",

    "background-repeat": "no-repeat",

    "background-size": "contain",

    "pointer-events": "none"

  },

  "background.useDefault": false,

  "background.useFront": true

}

2.2 全屏图片配置

{

  "background.customImages": ["https://upload-bbs.miyoushe.com/upload/2024/01/15/196231062/1145c3a2f56b2f789a9be086b546305d_3972870625465222006.png"],

  "background.enabled": true,

  "background.style": {

    "content": "''",

    "pointer-events": "none",

    "position": "absolute",

    "z-index": "99999",

    "height": "100%",

    "width": "100%",

    "background-repeat": "no-repeat",

    "background-size": "cover",

    "background-position": "content",

    "opacity": 0.3

  },

  "background.useDefault": false,

  "background.useFront": true

}

详细说明版

第一步，你还是需要下载 background 这个插件。

• background 插件的官方中文文档

第二步，配置解析

我们看官方文档里面，有两个配置是需要说明一下的

• background.customImages:
  
  
  
  
  • 是一个数组，默认是用第一张图片做背景图，在分屏的时候第二屏就用的是数组的第二个元素，以此类推
  
  
  • 支持 https 协议和本地的 file 协议
    
    
    
    • 因为我有公司机器和自己电脑，所以本地协议不太适用我，但是我之前一直用的是本地协议，并且下面会教大家如何白嫖图床
    
    
    
    
  
  
  
  


• background.style:
  
  
  
  
  • 作为一个前端，看到上面的内容是不是十分的熟悉，其实这个插件的底层原理就是去改 vscode 的 css，所以你可以想想成一个需求，在一个界面上显示一张图片，css 可以怎么写，背景图就可以是啥样的
  
  
  • 如果你看不懂 css 代码，你可以直接复制我上面提供的两种配置，一个全屏的，一个是在右下角固定一小只的
  
  
  
  


• 如果你觉得背景图太亮了，有点看不清代码，你可以修改 background.style.opacity这个属性，降低图片的透明度。


• 发现最新版本支持 background.interval 来轮播背景图了

高清社死图片

OK，其实到这就没啥了，但是到这里和原神好像并没有什么太大的关系，那现在我就教你怎么白嫖米游社的图床，并且获取高清的原神图片

• 第一步，你需要有一个米游社的账号，当然，玩原神的不能没有吧


• 第二步，随便找个帖子进行评论回复，如果你怕麻烦别人，可以自己发一贴
  
  
  
  
  • 
  
  
  
  


• 第三步：新标签页打开
  
  
  
  
  • 
  
  
  
  


• 到这里，你就能白嫖米游社的图床了，如果你是评论的自己的图片，新标签页打开之后，删除 url 中 ? 后面所有的内容，就可以得到原图 https 的链接了


• 但是又遇到一个问题，我就是很喜欢米游社的图片，但是图片的分辨率太低了怎么办？
  
  
  
  
  • 提供两个用 ai 来放大图片的网站
  
  
  • waifu2x.udp.jp/
  
  
  • bigjpg.com/
  
  
  • 把图片放大之后，在用上面白嫖图床的方法就可以了
  
  
  
  

最后

水一期，求三连 + 可以在评论区分享你的背景图嘛

抛个砖头

不知道大家用了这么久的掘金，有没有对它文章中的阅读量的实现有过好奇呢？

想象一下，你每次打开一篇文章时，都会有一个数字告诉你多少人已经读过这篇文章。那么这个数字是怎么得出来的呢？

有些人可能会认为，每次有人打开文章，数字就加1，不是很简单吗？ 起初我也以为这样，哈哈（和大家站在同一个高度），但（好了，我不说了，继续往下看吧！）

引个玉

文章阅读量的统计看似简单，实则蕴含着巧妙的逻辑和高效的技术实现。我们想要得到的阅读量，并非简单的页面刷新次数，而是真正独立阅读过文章的人数。因此，传统的每次页面刷新加1的方法显然不够准确，它忽略了用户的重复访问。

同时，阅读作为一个高频操作，如果每次都直接写入数据库，无疑会给数据库带来巨大的压力，甚至可能影响到整个系统的性能和稳定性。这就需要我们寻找一种既能准确统计阅读量，又能减轻数据库压力的方法。

Redis，这个高性能的内存数据库，为我们提供了解决方案。我们可以利用Redis的键值对存储特性，将用户ID和文章ID的组合作为键，设置一个短暂的过期时间，比如15分钟。当用户首次访问文章时，我们在Redis中为这个键设置一个值，表示该用户已经阅读过这篇文章。如果用户在15分钟内再次访问，我们可以直接判断该键是否存在，如果存在，则不再增加阅读量，否则进行增加。

这种方法的优点在于，它能够准确地统计出真正阅读过文章的人数，而不是简单的页面刷新次数。同时，通过将阅读量先存储在Redis中，我们避免了频繁地写入数据库，从而大大减轻了数据库的压力。

最后，我们还需要考虑如何将Redis中的阅读量最终写入数据库。由于数据库的写入操作相对较重，我们不宜频繁进行。因此，我们可以选择在业务低峰期，比如凌晨2到4点，使用定时任务将Redis中的阅读量批量写入数据库。这样，既保证了阅读量的准确统计，又避免了频繁的数据库写入操作，实现了高效的系统运行。

思路梳理

代码层面

项目使用的后端框架为NestJS

配置下redis

一、安装redis plugin

npm install --save redis

二、创建redis模块

三、初始化连接redis相关配置

@Module({

  providers: [

    RedisService,

    {

      provide: 'REDIS_CLIENT',

      async useFactory(configService: ConfigService) {

        console.log(configService.get('redis_server_host'));

        const client = createClient({

          socket: {

            host: configService.get('redis_server_host'),

            port: configService.get('redis_server_port'),

          },

          database: configService.get('redis_server_db'),

        });

        await client.connect();

        return client;

      },

      inject: [ConfigService],

    },

  ],

  exports: [RedisService],

})

Redis是一个Key-Value型数据库，可以用作数据库，所有的数据以Key-Value的形式存在服务器的内存中，其中Value可以是多种数据结构，如字符串（String）、哈希（hashes）、列表（list）、集合（sets）和有序集合（sorted sets）等类型

在这里会用到字符串和哈希两种。

创建文章表和用户表

我的项目中创建有post.entity和user.entity这两个实体表，并为post文章表添加以下

这三个字段，在这里我们只拿 阅读量 说事。

访问文章详情接口-阅读量+1

  /**

   * @description 增加阅读量

   * @param id

   * @returns

   */

  @Get('xxx/:id')

  @RequireLogin()

  async frontIncreViews(@Param('id') id: string, @Req() _req: any,) {

    console.log('frontFindOne');

    return await this.postService.frontIncreViews(+id, _req?.user);

  }

前文已经说过，同一个用户多次刷新，如果不做处理，就会产生多次无效的阅读量。 因此，为了避免这种情况方式，我们需要为其增加一个用户文章id组合而成的标记，并设置在有效时间内不产生多次阅读量。

那么，有的掘友可能会产生一个疑问，如果用户未登录，那么以游客的身份去访问文章就不产生阅读记录了吗？

其实同理！

在我的项目中只是，要求需要用户登录后才能访问，
那么我这就会以 userID_postID_ 来组成标识区分用户和文章罢了。
而如果想以游客身份，我们可以获取用户 IP_postID 这样的组合来做标识即可

接下来说下postService中调用的frontIncreViews方法
直接贴代码：

 const res = await this.redisService.hashGet(`post_${id}`);



    if (res.viewCount === undefined) {

      const post = await this.postRepository.findOne({ where: { id } });



      post.viewCount++;



      await this.postRepository.update(id, { viewCount: post.viewCount });



      await this.redisService.hashSet(`post_${id}`, {

        viewCount: post.viewCount,

        likeCount: post.likeCount,

        collectCount: post.collectCount,

      });

      // 在用户访问文章的时候在 redis 存一个 10 分钟过期的标记，有这个标记的时候阅读量不增加

      await this.redisService.set(`user_${user.id}_post_${id}`, 1, 10);



      return post.viewCount;

    } else {

      const flag = await this.redisService.get(`user_${user.id}_post_${id}`);

      console.log(flag);

      if (flag) {

        return res.viewCount;

      }



      await this.redisService.hashSet(`post_${id}`, {

        ...res,

        viewCount: +res.viewCount + 1,

      });



      await this.redisService.set(`user_${user.id}_post_${id}`, 1, 10);

      return +res.viewCount + 1;

    }

  }

const res = await this.redisService.hashGet(`post_${id}`);

使用Redis的哈希表结构，从键post_${id}中获取文章的信息，其中可能包含阅读量（viewCount）、点赞数（likeCount）和收藏数（collectCount）。

2. 检查Redis中是否存在阅读量:

if (res.viewCount === undefined) {

如果Redis中没有阅读量数据，说明这篇文章的阅读量还没有被初始化。

3. 从数据库中获取文章并增加阅读量:

const post = await this.postRepository.findOne({ where: { id } });

post.viewCount++;

await this.postRepository.update(id, { viewCount: post.viewCount });